你能将css规则`content`应用于子元素吗？

Question

您可以将ccs规则内容应用于子元素吗？

css：

a:link:before, a:visited:before{
    content: " "attr(href)" ";
}

html：

<a href="/home">Home</a>

结果：

 -------------
|    /home    |
|    Home     |
 -------------

但是我想做以下事情：

html：

<a href="/home"><span>home</span></a>

使用之前的css，href值将显示在span之前。

是否可以将其显示在span？

中

我试过this。这是一个站点地图。

Answer 1

不，那是不可能的。

要在span内制作生成的内容，您需要a:link span:before。

不幸的是，在这种情况下，content: " "attr(href)" ";将不再有效，因为a元素不再是选择器的主题 - span是，{{1} }没有span属性。

Answer 2

这是不可能的，因为attr(...)仅适用于元素本身，但实际上你需要这样的东西：

a:link > span:before { content: " "parent.attr(href)" "; }

但CSS中没有parent.attr()这样的东西。