Thomas Horster » inline styles http://tom.kulturlounge.de/blog eat the cookie before the cookie eats you Mon, 22 Aug 2011 20:24:40 +0000 en hourly 1 http://wordpress.org/?v=3.2.1 Wie man inline styles in CSS überschreiben kannhttp://tom.kulturlounge.de/blog/2009/05/10/wie-man-inline-styles-in-css-uberschreiben-kann/ http://tom.kulturlounge.de/blog/2009/05/10/wie-man-inline-styles-in-css-uberschreiben-kann/#comments Sun, 10 May 2009 10:33:52 +0000 Tom http://tom.kulturlounge.de/blog/?p=646 Weiterlesen →Verwandte Artikel:
  1. Flex 3 Beta 2 ist draußen
  2. Adobe Thermo
  3. Facebook secrets – what you where afraid to ask
]]> Wenn man inline Styles überschreiben, macht man das mit !important, will man aber nur inline gestylte Tags in CSS im Webdesign überschreiben, gibt es keine andere Möglichkeit, als diese styles direkt anzupassen? Falsch!
Eine weitere Möglichkeit ist mit Hilfe des [style] Keywords innerhalb eines Scriptblockes oder einer externen CSS nur diese Tags mit inline Styles anzusprechen.

Ein Beispiel :

<div class="showMe">
<span style="font-weight: bold; color: #ff0000;">Hello World - wird gestyled</span>
</div>
<div class="showMe">
<span>Hello World - wird nicht gestyled</span>
</div>

.showMe span[style]{font-weight: normal !important;color: #0000ff !important;}

Wie das immer so ist und wie man sich wahrscheinlich aufgrund des [style] im Selektor denken konnte, funktioniert dies nicht im IE6, aber im IE7 & IE8 sowie allen modernen Browsern.
Natürlich bleibt die Frage, wann man so etwas sinnvoll anwenden kann, da man inline styles generell vermeiden
sollte, aber es kann mit Sicherheit nicht schaden, so etwas zu wissen.

Seeing is believing, daher gibt es hier ein kleines Showcase.

[gefunden bei SOTAHNAKA]

Verwandte Artikel:

  1. Flex 3 Beta 2 ist draußen
  2. Adobe Thermo
  3. Facebook secrets – what you where afraid to ask

]]> http://tom.kulturlounge.de/blog/2009/05/10/wie-man-inline-styles-in-css-uberschreiben-kann/feed/ 3