我希望代码中的div类在div的内容开头(或之后)有一个图标。基本上我所做的是将glyphicon CSS复制并粘贴到所需的CSS类中(并使用<body ng-app>
<textarea ng-model="test" ng-trim="false" maxlength="1500"></textarea>
<span>{{1500 - test.length}} left</span>
</body>
和:before
来指定位置)
所以基本上div如下:
:after
和CSS:
<div class="leaf in-leaf">in-elem1</div>
有没有比使用相同的glyphicon CSS更好的方法呢?也许是一种简单地将glyphicon绑定到类的方法?
答案 0 :(得分:3)
您可以覆盖类.glyphicon
和.glyphicon:before
的样式,只要它与其他类.leaf
一起使用,然后您可以使用所需的任何.glyphicon
,如图所示下面的片段:
@import url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css');
.leaf-holder {
border: 1px solid #000;
margin: 0 auto;
width: 200px;
}
.leaf.glyphicon {
display: block;
line-height: 20px;
top: auto;
}
.leaf.glyphicon:before {
position: absolute;
right: 0;
top: 0;
}
&#13;
<div class="leaf-holder">
<div class="leaf glyphicon glyphicon-triangle-right">in-elem1</div>
</div>
<div class="leaf-holder">
<div class="leaf glyphicon glyphicon-menu-hamburger">in-elem1</div>
</div>
<div class="leaf-holder">
<div class="leaf glyphicon glyphicon-apple">in-elem1</div>
</div>
<div class="leaf-holder">
<div class="leaf glyphicon glyphicon-triangle-right">in-elem1</div>
</div>
&#13;