Reply To: attribute display and styling

[mag3737]

You may be able to gain some benefit from the [attrname] selector.  This will match all elements that have a particular attribute set, regardless of the attribute value:

[code]
[attr1]:before {
content: “attr1=” attr(attr1);
background-color: yellow;
color: blue;
}
[/code]

Then you would have to make combinations of attribute names to build up all combinations of attribute assignments:

[code]
[attr1][attr2]:before{
content: “attr1=” attr(attr1) “,attr2=” attr(attr2);
background-color: yellow;
color: blue;
}

[attr1][attr3]:before{
content: “attr1=” attr(attr1) “,attr3=” attr(attr3);
background-color: yellow;
color: blue;
}

[attr2][attr3]:before{
content: “attr2=” attr(attr2) “,attr3=” attr(attr3);
background-color: yellow;
color: blue;
}

[attr1][attr2][attr3]:before{
content: “attr1=” attr(attr1) “,attr2=” attr(attr2) “,attr3=” attr(attr3);
background-color: yellow;
color: blue;
}
[/code]

If you have N different attributes you would need to write 2^N CSS selectors, but this is better than you would get for doing it element-by-element PLUS dealing with all the attribute combinations per element.

If the properties you are assigning for all combinations are as “consistent” as the examples I gave above, or at least programmatically definable you could also generate and apply the above CSS via script instead of having it in the CSS file in the customization.

Reply