在使用Bootstrap 3和AngularJS时，在输入字段后添加星号。

9 浏览
0 Comments

在使用Bootstrap 3和AngularJS时，在输入字段后添加星号。

\n\n请填写您的名字\nCSS:\n.required:after { content:\" *\"; }\n问题：\n我知道如何在标签后面添加星号，但我希望它出现在输入框后面。目前它出现在第二个div中的错误消息后面。是否可以使用CSS在输入框后面添加星号？

0

3 答案

0 Comments

问题的原因：在给输入框添加星号的样式时，使用了伪元素`:after`来添加内容，但是在文本框所在的div中还有另一个div，导致样式无法生效。

解决方法：修改CSS样式，将`:after`伪元素的位置调整到正确的位置。

修改后的代码如下：

.required div:after {
  content: " *";
  position: absolute;
  top: 0px;
  right: 6px;
}

0
0 Comments

问题出现的原因：

在Bootstrap 3和AngularJS中，无法直接在输入字段后面添加asterisk（星号）。

解决方法：

可以通过在每个.required字段上使用JavaScript添加一个span元素来解决此问题。具体代码如下：

$('.required input').after('*');

这将自动为每个.required字段添加一个星号，非常方便。

0
0 Comments

问题的原因是使用HTML方法添加星号时，星号会显示在下一行。解决方法是使用CSS方法添加星号，并设置其位置为绝对定位，使其显示在输入框后面。

以下是解决方法的具体代码：

.required:after {
  content: " *";
  position: absolute;
  top: 30px;
  left: 190px;
}

在需要添加星号的输入框后面添加一个新的元素，并在其中放置星号。


*

通过将星号设置为绝对定位，可以确保星号显示在输入框的后面。

以上就是在使用Bootstrap 3和AngularJS时添加输入框后面的星号的问题的原因和解决方法。

0