RSS Feed
Twitter
Ein kleiner, aber effektiver Trick um Inline-Styles per CSS zu überschreiben. Es kommt sicherlich nicht allzu häufig vor, dass Inline-Styles überschrieben werden müssen, sollte es aber der Fall sein, wird es schwierig. Beispielsweise ist es bei einem CMS schwierig die Inline-Styles zu entfernen, bzw. es ist meist nur mit hohem Zeitaufwand möglich. Mit dem nachfolgenden Trick, können die Inline-Styles überschrieben werden:
1 2 3 4 5 | /* override inline styles */ span[style]{ color: inherit !important; font-size: inherit !important; } |
Bei diesem Beispiel wird allen SPAN-Tags, die ein STYLE-Attribut besitzen, durch inherit mitgeteilt, dass sie die Eigenschaften von ihren Eltern-Element erben sollen. Durch die Angabe von !important wird dem Browser mitgeteilt, dass dieser nur diese und auch nur diese Eigenschaft und nicht z.B. Inline-Styles verwendet.
Wer sich etwas intensiver mit dem Thema beschäftigen möchte, der sollte sich den Artikel zum Überschreiben von Inline-Styles von Natalie Jost durchlesen.
Dieser Ansatz hat aber auch noch einen anderen interessanten Nebeneffekt, denn werden innerhalb des selben Selektoren zwei Formatierungen notiert, wobei die erste mit dem Wert !important versehen wird und die zweite nicht, ignorieren die IE-Browser kleiner gleich Version IE6, den ersten Wert und führen stattdesssen den zweiten aus.