Inline Content CSS Property
Is it possible to use CSS's 'content' property using inline CSS something like this:
<p class="myclass" style=".myclass:after:content = 'my con开发者_StackOverflow中文版tent here'">Hello There !!</p>
No. Inline styles via the 'style' attribute can only be applied to the context element, without any selectors of any sort.
I think you mean something like this:
<html>
<head>
<style>
.myclass:after {
content: "my content here";
}
</style>
</head>
<body>
<p class="myclass">Hello There</p>
</body>
</html>
You can't use selectors in style attributes, so I would say no.
You can still put the style in the html file, like so:
<style type="text/css">
.myclass:after { content: 'my content here'; }
</style>
...
<foo class="myclass">Hello There!!</foo>
Let's assume the OP wanted to generate the inline style dynamically. Here is a kludgey php fragment (from a yii view I wrote) that uses the label property of a data model as both the id attribute and the css content:
$content = "<div id='".strtr($model->label,' ','_')."'><style type='text/css'>#"
. strtr($model->label,' ','_').":before {content: '".$model->label."';}</style>"
. $this->renderPartial( '//team/_tree', array( 'models' => $model->teams ), true )
. "</div>\n" ;
There exists a working draft on Syntax of CSS rules in HTML's "style" attribute.
If it works as in the WD you should be able to do something like:
<p class="myclass" style="{color: #C00; font-weight: bold} :after {content: 'my content here'}">Hello There !!</p>
精彩评论