Using HTML Attributes as CSS Property Values

The spectrum says:

The attr () function returns the value of the element attribute to use as the value in the property . If used in a pseudo-element, it returns the attribute value of the element of the element generating the pseudo-element.

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

However, this does not work. When I use background-image: url(attr(href)); , I get the string "attr (href)" as the value of the attribute, not the value itself.

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

Any ideas why this is broken?

+6
source share
1 answer

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

Your syntax seems to be correct otherwise until you change the specification.

+10
source

Source: https://habr.com/ru/post/918606/


All Articles