我喜欢通过bootstrap看的例子
<css>
.bs-docs-example {
background-color: #FFFFFF;
border: 1px solid #DDDDDD;
border-radius: 4px 4px 4px 4px;
...
}
.bs-docs-example:after {
background-color: #F5F5F5;
border: 1px solid #DDDDDD;
border-radius: 4px 0 4px 0;
color: #9DA0A4;
content: "Title";
...
}
但是我需要动态更改.bs-docs-example中的内容
如：
<html>
<div class="bs-docs-example" ng-style="content:'{{ title }}';"
ng-repeat="title in titles">
你认为这是可能吗？如何 ？
感谢提前.
var somecolorvar = "#F00";
$scope.mystyles = ".something:after { color: " + somecolorvar + "; }";
<style ng-bind-html="mystyles"></style>
然后你会得到这样的东西
<style>.something:after { color: #F00; }</style>
编辑：您也可以通过css attr()处理上述问题,这将把属性拉入到内容中
.something:after {
display: inline;
content: '- Value ' attr(value);
}
<div class="something" value="123">this is</div>
<div class="something" value="456">this be</div>
你会看到像：
this is - Value 123 this be - Value 456
