使用HTML属性作为CSS属性值 [英] Using HTML attributes as CSS property values

问题描述

规范说：

attr（）函式会传回元素上的属性值，属性中的值。如果在伪元素上使用，则它返回伪元素的原始元素上的属性的值。

http://www.w3.org/TR/css3-values/#attr

但是，这似乎不工作。当我使用 background-image：url（attr（href））; 我得到字符串attr（href）作为属性值，而不是值本身。

http://jsfiddle.net/x2Rpt/1/

解决方案

没有破损;只是没有浏览器实施 CSS3版本 attr（） 。目前，实施只适用于在CSS2.1中引入的版本，其限制为 content 属性。

您的语法似乎正确，除非更改规格

The spec says:

The attr() function returns the value of an attribute on the element for use as a value in a property. If used on a pseudo-element, it returns the value of the attribute on the pseudo-element's originating element.

http://www.w3.org/TR/css3-values/#attr

However, this doesn't seem to work. When I use background-image: url(attr(href)); I get string "attr(href)" as attribute value, not the value itself.

http://jsfiddle.net/x2Rpt/1/

Any ideas why this is broken?

解决方案

It's not broken; it's just that no browser has implemented the CSS3 version of attr(). Currently, implementations only exist for the one that was introduced in CSS2.1, which is limited to the content property for generated and replaced content.

Your syntax seems correct otherwise, until and unless changes are made to the spec.

这篇关于使用HTML属性作为CSS属性值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！