Question

是否可以使用类似的内联CSS来使用CSS的'content'属性：

<p class="myclass" style=".myclass:after:content = 'my content here'">Hello There !!</p>

Answer 1

没有。通过'style'属性的内联样式只能应用于上下文元素，而不需要任何排序的任何选择器。

Answer 2

我认为你的意思是这样的：

<html>
  <head>
    <style>
      .myclass:after {
        content: "my content here";
      }
    </style>
  </head>
  <body>
    <p class="myclass">Hello There</p>
  </body>
</html>

Answer 3

你不能在样式属性中使用选择器，所以我会说不。

您仍然可以将样式放在html文件中，如下所示：

<style type="text/css">
    .myclass:after { content: 'my content here'; }
</style>
...
<foo class="myclass">Hello There!!</foo>

Answer 4

让我们假设OP想要动态生成内联样式。这是一个kludgey php片段（从我写的yii视图），它使用数据模型的label属性作为id属性和css内容：

$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" ;

Answer 5

Syntax of CSS rules in HTML's "style" attribute上有一份工作草案。

如果它像在WD中一样工作，你应该可以做类似的事情：

<p class="myclass" style="{color: #C00; font-weight: bold} :after {content: 'my content here'}">Hello There !!</p>

内联内容CSS属性

5 个答案: