Widget:CSS

Aus Stupidedia, der sinnfreien Enzyklopädie!
Wechseln zu: Navigation, Suche

Weist Elementen CSS zu. Darf gerne auf allen Seiten verwendet werden, sofern es nötig und sinnvoll ist.

Anwendung

{{#widget:CSS|selectors=Elementselektoren|style=CSS}}

oder: {{#widget:CSS|selectors=Elementselektoren|style=CSS|media=Media Query}}

  • Die Elementselektoren sind beliebige CSS-Selektoren, die allerdings keine Kommata enthalten dürfen, da damit die einzelnen Selektoren getrennt werden. Es funktionieren aber generell nur Selektoren innerhalb des Inhaltsbereichs.
  • CSS ist das Gleiche, was auch im style-Attribut eines Elements stehen kann.
  • Media Query (optional) ist eine media query, mit der Styles geräteabhängig gesetzt werden können. Zum Beispiel sorgt {{#widget:CSS|selectors=.bla|style=color: black|media=max-width: 800px}} dafür, dass die Schriftfarbe des Elementes mit der Klasse bla auf Schwarz gesetzt wird, wenn die Breite des Fensters maximal 800 Pixel beträgt.

Guckst du auch Hilfe:Stylesheets.

Code

<style type="text/css">
<!--{if isset($media)}-->
@media (<!--{$media|regex_replace:'/[<{}]/':''|default:''}-->) {
<!--{/if}-->
div#mw-content-text <!--{$selectors|regex_replace:'/[<{}]/':''|replace:',':', div#mw-content-text '|default:''}--> {
    <!--{$style|regex_replace:'# [{}<>] | expression | filter\s*: | accelerator\s*: | url\s*\(\s*[\'"](?!(https?://www\.stupidedia\.org|https?://stupidedia.localhost|)/images/.*) | image\s*\( | image-set\s*\( #ix':''}-->;
}
<!--{if isset($media)}-->
}
<!--{/if}-->
</style>

Linktipps: Faditiva und 3DPresso