Harry Carvalho Harry Carvalho - 1 month ago 6
CSS Question

How to modify only via CSS a color already defined in HTML?

I'm trying to modify a color in a text marked by the tag "U" with the color already defined in html.

It is so in html:



<u> <font color="#0000c0">somente no seu e-commerce</font> </u>





I tried as follows in the css:

u {color: rgb (20,20,20)! important; }


but I do not accept the color, I believe that the fact is defined in the source code.

the important detail, I do not have access to modify the html, as it is generated by web software. all layout modification gotta be done ONLY by CSS.

Answer

Your code is successfully changing the colour of the <u> element, but you can't see any effect because the <font> element does not have color: inherit (and there is no text outside of the <font>). It has its own colour and does not use the <u>'s colour at all.

To change that, you need to target the font element.

font {
  color: rgb(20, 20, 20);
}
<u> <font color="#0000c0">somente no seu e-commerce</font> </u>

There is no need for the rule to be !important. There's no CSS of a higher specificity to hammer.