<?xml version="1.0"?>
<feed xmlns="http://www.w3.org/2005/Atom" xml:lang="de">
	<id>https://wiki.cowboy-of-bottrop.de/index.php?action=history&amp;feed=atom&amp;title=Hilfe%3ACSS</id>
	<title>Hilfe:CSS - Versionsgeschichte</title>
	<link rel="self" type="application/atom+xml" href="https://wiki.cowboy-of-bottrop.de/index.php?action=history&amp;feed=atom&amp;title=Hilfe%3ACSS"/>
	<link rel="alternate" type="text/html" href="https://wiki.cowboy-of-bottrop.de/index.php?title=Hilfe:CSS&amp;action=history"/>
	<updated>2026-10-09T01:05:57Z</updated>
	<subtitle>Versionsgeschichte dieser Seite in Cowboy’s Wiki</subtitle>
	<generator>MediaWiki 1.43.0</generator>
	<entry>
		<id>https://wiki.cowboy-of-bottrop.de/index.php?title=Hilfe:CSS&amp;diff=6022&amp;oldid=prev</id>
		<title>Cowboy am 13. August 2026 um 15:06 Uhr</title>
		<link rel="alternate" type="text/html" href="https://wiki.cowboy-of-bottrop.de/index.php?title=Hilfe:CSS&amp;diff=6022&amp;oldid=prev"/>
		<updated>2026-08-13T15:06:24Z</updated>

		<summary type="html">&lt;p&gt;&lt;/p&gt;
&lt;table style=&quot;background-color: #fff; color: #202122;&quot; data-mw=&quot;interface&quot;&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;tr class=&quot;diff-title&quot; lang=&quot;de&quot;&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;← Nächstältere Version&lt;/td&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;Version vom 13. August 2026, 17:06 Uhr&lt;/td&gt;
				&lt;/tr&gt;&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l215&quot;&gt;Zeile 215:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Zeile 215:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* Die präzise Farbangabe nur für die Hintergrundfarbe würde etwa lauten: &amp;lt;code style=&amp;quot;white-space: nowrap&amp;quot;&amp;gt;background-color: #FFFF00&amp;lt;/code&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* Die präzise Farbangabe nur für die Hintergrundfarbe würde etwa lauten: &amp;lt;code style=&amp;quot;white-space: nowrap&amp;quot;&amp;gt;background-color: #FFFF00&amp;lt;/code&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* Kürzer und in der Regel genauso wirksam ist: &amp;lt;code style=&amp;quot;white-space: nowrap&amp;quot;&amp;gt;background: #FFFF00&amp;lt;/code&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* Kürzer und in der Regel genauso wirksam ist: &amp;lt;code style=&amp;quot;white-space: nowrap&amp;quot;&amp;gt;background: #FFFF00&amp;lt;/code&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;** Hier kämen noch weitere Spezifikationen für den Hintergrund in Frage, die in &lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;der Wikipedia &lt;/del&gt;aber eher selten und teilweise unterbunden sind.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;** Hier kämen noch weitere Spezifikationen für den Hintergrund in Frage, die in &lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;{{SITENAME}} &lt;/ins&gt;aber eher selten und teilweise unterbunden sind.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* &amp;lt;code&amp;gt;background-color&amp;lt;/code&amp;gt; ist im Zweifelsfall sicherer als &amp;lt;code&amp;gt;background&amp;lt;/code&amp;gt;.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* &amp;lt;code&amp;gt;background-color&amp;lt;/code&amp;gt; ist im Zweifelsfall sicherer als &amp;lt;code&amp;gt;background&amp;lt;/code&amp;gt;.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* In der Regel und insbesondere im ANR genügt es, &amp;lt;code style=&amp;quot;white-space: nowrap&amp;quot;&amp;gt;background:#FFFF00&amp;lt;/code&amp;gt; zu schreiben. Dies ist übersichtlicher und kürzer.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* In der Regel und insbesondere im ANR genügt es, &amp;lt;code style=&amp;quot;white-space: nowrap&amp;quot;&amp;gt;background:#FFFF00&amp;lt;/code&amp;gt; zu schreiben. Dies ist übersichtlicher und kürzer.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;

&lt;!-- diff cache key d0429607-9klu4_:diff:1.41:old-6021:rev-6022:php=table --&gt;
&lt;/table&gt;</summary>
		<author><name>Cowboy</name></author>
	</entry>
	<entry>
		<id>https://wiki.cowboy-of-bottrop.de/index.php?title=Hilfe:CSS&amp;diff=6021&amp;oldid=prev</id>
		<title>Cowboy am 13. August 2026 um 15:05 Uhr</title>
		<link rel="alternate" type="text/html" href="https://wiki.cowboy-of-bottrop.de/index.php?title=Hilfe:CSS&amp;diff=6021&amp;oldid=prev"/>
		<updated>2026-08-13T15:05:02Z</updated>

		<summary type="html">&lt;p&gt;&lt;/p&gt;
&lt;table style=&quot;background-color: #fff; color: #202122;&quot; data-mw=&quot;interface&quot;&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;tr class=&quot;diff-title&quot; lang=&quot;de&quot;&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;← Nächstältere Version&lt;/td&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;Version vom 13. August 2026, 17:05 Uhr&lt;/td&gt;
				&lt;/tr&gt;&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l219&quot;&gt;Zeile 219:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Zeile 219:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* In der Regel und insbesondere im ANR genügt es, &amp;lt;code style=&amp;quot;white-space: nowrap&amp;quot;&amp;gt;background:#FFFF00&amp;lt;/code&amp;gt; zu schreiben. Dies ist übersichtlicher und kürzer.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* In der Regel und insbesondere im ANR genügt es, &amp;lt;code style=&amp;quot;white-space: nowrap&amp;quot;&amp;gt;background:#FFFF00&amp;lt;/code&amp;gt; zu schreiben. Dies ist übersichtlicher und kürzer.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* Im Wikitext sind für die &amp;lt;code&amp;gt;style&amp;lt;/code&amp;gt;-Angaben ohnehin keine anderen Spezifikationen als die Farbe sinnvoll wählbar.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* Im Wikitext sind für die &amp;lt;code&amp;gt;style&amp;lt;/code&amp;gt;-Angaben ohnehin keine anderen Spezifikationen als die Farbe sinnvoll wählbar.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* Lediglich bei [[Hilfe:Tabellen|sortierbaren Tabellen]] muss im Tabellenkopf &amp;lt;code&amp;gt;background-color:&amp;lt;/code&amp;gt; verwendet werden, weil hier später durch &lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;[[&lt;/del&gt;JavaScript&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;]] &lt;/del&gt;die Sortierpfeile als Hintergrundbild generiert werden. Durch&amp;lt;code&amp;gt;background:&amp;lt;/code&amp;gt; wird jedoch ggf. der Browser schon darauf festgelegt, dass kein Hintergrundbild angezeigt werden soll.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* Lediglich bei [[Hilfe:Tabellen|sortierbaren Tabellen]] muss im Tabellenkopf &amp;lt;code&amp;gt;background-color:&amp;lt;/code&amp;gt; verwendet werden, weil hier später durch &lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;{{WP|&lt;/ins&gt;JavaScript&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;}} &lt;/ins&gt;die Sortierpfeile als Hintergrundbild generiert werden. Durch&amp;lt;code&amp;gt;background:&amp;lt;/code&amp;gt; wird jedoch ggf. der Browser schon darauf festgelegt, dass kein Hintergrundbild angezeigt werden soll.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* In der Vorlagenprogrammierung und ähnlich fortgeschrittenem Kontext wird man vorrangig explizit &amp;lt;code&amp;gt;background-color&amp;lt;/code&amp;gt; angeben, um die Wirkung anderweitiger Effekte nicht zu behindern.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* In der Vorlagenprogrammierung und ähnlich fortgeschrittenem Kontext wird man vorrangig explizit &amp;lt;code&amp;gt;background-color&amp;lt;/code&amp;gt; angeben, um die Wirkung anderweitiger Effekte nicht zu behindern.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&amp;lt;/ref&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&amp;lt;/ref&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;

&lt;!-- diff cache key d0429607-9klu4_:diff:1.41:old-6020:rev-6021:php=table --&gt;
&lt;/table&gt;</summary>
		<author><name>Cowboy</name></author>
	</entry>
	<entry>
		<id>https://wiki.cowboy-of-bottrop.de/index.php?title=Hilfe:CSS&amp;diff=6020&amp;oldid=prev</id>
		<title>Cowboy: /* Veraltete Anweisungen */</title>
		<link rel="alternate" type="text/html" href="https://wiki.cowboy-of-bottrop.de/index.php?title=Hilfe:CSS&amp;diff=6020&amp;oldid=prev"/>
		<updated>2026-08-13T14:58:28Z</updated>

		<summary type="html">&lt;p&gt;&lt;span class=&quot;autocomment&quot;&gt;Veraltete Anweisungen&lt;/span&gt;&lt;/p&gt;
&lt;table style=&quot;background-color: #fff; color: #202122;&quot; data-mw=&quot;interface&quot;&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;tr class=&quot;diff-title&quot; lang=&quot;de&quot;&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;← Nächstältere Version&lt;/td&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;Version vom 13. August 2026, 16:58 Uhr&lt;/td&gt;
				&lt;/tr&gt;&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l102&quot;&gt;Zeile 102:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Zeile 102:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;== Veraltete Anweisungen ==&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;== Veraltete Anweisungen ==&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;In den 1990er Jahren, bevor sich CSS durchsetzte, wurden in &lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;[[&lt;/del&gt;Hypertext Markup Language|HTML&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;]] &lt;/del&gt;noch besondere Attribute für jede einzelne Eigenschaft definiert. Diese sind aber nicht so reichhaltig wie die Möglichkeiten von CSS. Man geht deshalb inzwischen davon ab und verwendet nur noch das Universal-Attribut &amp;lt;code&amp;gt;style=&amp;lt;/code&amp;gt; und einheitlich in allen Situationen CSS. Einige häufige Fälle:&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;In den 1990er Jahren, bevor sich CSS durchsetzte, wurden in &lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;{{WP|&lt;/ins&gt;Hypertext Markup Language|HTML&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;}} &lt;/ins&gt;noch besondere Attribute für jede einzelne Eigenschaft definiert. Diese sind aber nicht so reichhaltig wie die Möglichkeiten von CSS. Man geht deshalb inzwischen davon ab und verwendet nur noch das Universal-Attribut &amp;lt;code&amp;gt;style=&amp;lt;/code&amp;gt; und einheitlich in allen Situationen CSS. Einige häufige Fälle:&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;{| class=&amp;quot;wikitable toptextcells sortable&amp;quot;&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;{| class=&amp;quot;wikitable toptextcells sortable&amp;quot;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l167&quot;&gt;Zeile 167:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Zeile 167:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;| Breite&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;| Breite&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;| &amp;lt;code&amp;gt;width: 20%&amp;lt;/code&amp;gt;&amp;lt;br /&amp;gt; &amp;lt;code&amp;gt;width: 250px&amp;lt;/code&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;| &amp;lt;code&amp;gt;width: 20%&amp;lt;/code&amp;gt;&amp;lt;br /&amp;gt; &amp;lt;code&amp;gt;width: 250px&amp;lt;/code&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;| In CSS gibt es viele Maßeinheiten, und es muss &amp;lt;code&amp;gt;px&amp;lt;/code&amp;gt; für „Pixel“ gesetzt werden, während es in &lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;[[&lt;/del&gt;Hypertext Markup Language|HTML&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;]] &lt;/del&gt;nur Prozent und Pixel gibt.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;| In CSS gibt es viele Maßeinheiten, und es muss &amp;lt;code&amp;gt;px&amp;lt;/code&amp;gt; für „Pixel“ gesetzt werden, während es in &lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;{{WP|&lt;/ins&gt;Hypertext Markup Language|HTML&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;}} &lt;/ins&gt;nur Prozent und Pixel gibt.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;|}&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;|}&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;/tr&gt;

&lt;!-- diff cache key d0429607-9klu4_:diff:1.41:old-6019:rev-6020:php=table --&gt;
&lt;/table&gt;</summary>
		<author><name>Cowboy</name></author>
	</entry>
	<entry>
		<id>https://wiki.cowboy-of-bottrop.de/index.php?title=Hilfe:CSS&amp;diff=6019&amp;oldid=prev</id>
		<title>Cowboy: /* Zeilenumbruch unterdrücken */</title>
		<link rel="alternate" type="text/html" href="https://wiki.cowboy-of-bottrop.de/index.php?title=Hilfe:CSS&amp;diff=6019&amp;oldid=prev"/>
		<updated>2026-08-13T14:57:04Z</updated>

		<summary type="html">&lt;p&gt;&lt;span class=&quot;autocomment&quot;&gt;Zeilenumbruch unterdrücken&lt;/span&gt;&lt;/p&gt;
&lt;table style=&quot;background-color: #fff; color: #202122;&quot; data-mw=&quot;interface&quot;&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;tr class=&quot;diff-title&quot; lang=&quot;de&quot;&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;← Nächstältere Version&lt;/td&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;Version vom 13. August 2026, 16:57 Uhr&lt;/td&gt;
				&lt;/tr&gt;&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l85&quot;&gt;Zeile 85:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Zeile 85:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;=== {{Anker|nowrap}} Zeilenumbruch unterdrücken ===&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;=== {{Anker|nowrap}} Zeilenumbruch unterdrücken ===&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;Mehrfache &amp;lt;code&amp;gt;&amp;amp;amp;nbsp;&amp;lt;/code&amp;gt; (&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;[[&lt;/del&gt;Geschütztes Leerzeichen|geschützte Leerzeichen&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;]]&lt;/del&gt;) können eingespart werden.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;Mehrfache &amp;lt;code&amp;gt;&amp;amp;amp;nbsp;&amp;lt;/code&amp;gt; (&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;{{WP|&lt;/ins&gt;Geschütztes Leerzeichen|geschützte Leerzeichen&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;}}&lt;/ins&gt;) können eingespart werden.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* &amp;lt;code&amp;gt;style=&amp;quot;white-space: nowrap&amp;quot;&amp;lt;/code&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* &amp;lt;code&amp;gt;style=&amp;quot;white-space: nowrap&amp;quot;&amp;lt;/code&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;/tr&gt;

&lt;!-- diff cache key d0429607-9klu4_:diff:1.41:old-6018:rev-6019:php=table --&gt;
&lt;/table&gt;</summary>
		<author><name>Cowboy</name></author>
	</entry>
	<entry>
		<id>https://wiki.cowboy-of-bottrop.de/index.php?title=Hilfe:CSS&amp;diff=6018&amp;oldid=prev</id>
		<title>Cowboy: /* Layout, Textfluss und zurücksetzen */</title>
		<link rel="alternate" type="text/html" href="https://wiki.cowboy-of-bottrop.de/index.php?title=Hilfe:CSS&amp;diff=6018&amp;oldid=prev"/>
		<updated>2026-08-13T14:56:26Z</updated>

		<summary type="html">&lt;p&gt;&lt;span class=&quot;autocomment&quot;&gt;Layout, Textfluss und zurücksetzen&lt;/span&gt;&lt;/p&gt;
&lt;table style=&quot;background-color: #fff; color: #202122;&quot; data-mw=&quot;interface&quot;&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;tr class=&quot;diff-title&quot; lang=&quot;de&quot;&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;← Nächstältere Version&lt;/td&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;Version vom 13. August 2026, 16:56 Uhr&lt;/td&gt;
				&lt;/tr&gt;&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l64&quot;&gt;Zeile 64:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Zeile 64:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* Element am rechten Seitenrand anordnen und vom Text umfließen lassen:&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* Element am rechten Seitenrand anordnen und vom Text umfließen lassen:&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;** &amp;lt;code&amp;gt;style=&amp;quot;float: right&amp;quot;&amp;lt;/code&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;** &amp;lt;code&amp;gt;style=&amp;quot;float: right&amp;quot;&amp;lt;/code&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;** &amp;lt;code&amp;gt;class=&quot;float-right&quot;&amp;lt;/code&amp;gt; – &#039;&#039;besser; vor allem, wenn es schon eine Klasse gibt; sorgt außerdem für einen Abstand zum &lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;[[&lt;/del&gt;Fließtext&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;]]&lt;/del&gt;&#039;&#039;&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;** &amp;lt;code&amp;gt;class=&quot;float-right&quot;&amp;lt;/code&amp;gt; – &#039;&#039;besser; vor allem, wenn es schon eine Klasse gibt; sorgt außerdem für einen Abstand zum &lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;{{WP|&lt;/ins&gt;Fließtext&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;}}&lt;/ins&gt;&#039;&#039;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;** Miniaturbilder werden standardmäßig auf diese Weise deklariert.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;** Miniaturbilder werden standardmäßig auf diese Weise deklariert.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* Genauso für den linken Seitenrand:&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* Genauso für den linken Seitenrand:&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;

&lt;!-- diff cache key d0429607-9klu4_:diff:1.41:old-6017:rev-6018:php=table --&gt;
&lt;/table&gt;</summary>
		<author><name>Cowboy</name></author>
	</entry>
	<entry>
		<id>https://wiki.cowboy-of-bottrop.de/index.php?title=Hilfe:CSS&amp;diff=6017&amp;oldid=prev</id>
		<title>Cowboy: /* CSS-Notation */</title>
		<link rel="alternate" type="text/html" href="https://wiki.cowboy-of-bottrop.de/index.php?title=Hilfe:CSS&amp;diff=6017&amp;oldid=prev"/>
		<updated>2026-08-13T14:55:53Z</updated>

		<summary type="html">&lt;p&gt;&lt;span class=&quot;autocomment&quot;&gt;CSS-Notation&lt;/span&gt;&lt;/p&gt;
&lt;table style=&quot;background-color: #fff; color: #202122;&quot; data-mw=&quot;interface&quot;&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;tr class=&quot;diff-title&quot; lang=&quot;de&quot;&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;← Nächstältere Version&lt;/td&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;Version vom 13. August 2026, 16:55 Uhr&lt;/td&gt;
				&lt;/tr&gt;&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l33&quot;&gt;Zeile 33:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Zeile 33:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* &amp;lt;code&amp;gt;%&amp;lt;/code&amp;gt; – relative Angabe, beispielsweise &amp;lt;code&amp;gt;50%&amp;lt;/code&amp;gt; (kein Leerzeichen zwischen Zahl und Prozentzeichen!)&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* &amp;lt;code&amp;gt;%&amp;lt;/code&amp;gt; – relative Angabe, beispielsweise &amp;lt;code&amp;gt;50%&amp;lt;/code&amp;gt; (kein Leerzeichen zwischen Zahl und Prozentzeichen!)&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* &amp;lt;code&amp;gt;em&amp;lt;/code&amp;gt; – ({{WP|Geviert (Typografie)|Geviert}}), etwas wie die Schrifthöhe oder Breite eines großen&amp;amp;nbsp;M: &amp;lt;code&amp;gt;5em&amp;lt;/code&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* &amp;lt;code&amp;gt;em&amp;lt;/code&amp;gt; – ({{WP|Geviert (Typografie)|Geviert}}), etwas wie die Schrifthöhe oder Breite eines großen&amp;amp;nbsp;M: &amp;lt;code&amp;gt;5em&amp;lt;/code&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* &amp;lt;code&amp;gt;px&amp;lt;/code&amp;gt; – &lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;[[&lt;/del&gt;Pixel&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;]]&lt;/del&gt;, etwa &amp;lt;code&amp;gt;20px&amp;lt;/code&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* &amp;lt;code&amp;gt;px&amp;lt;/code&amp;gt; – &lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;{{WP|&lt;/ins&gt;Pixel&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;}}&lt;/ins&gt;, etwa &amp;lt;code&amp;gt;20px&amp;lt;/code&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;== Klassen und Stile ==&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;== Klassen und Stile ==&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;

&lt;!-- diff cache key d0429607-9klu4_:diff:1.41:old-6016:rev-6017:php=table --&gt;
&lt;/table&gt;</summary>
		<author><name>Cowboy</name></author>
	</entry>
	<entry>
		<id>https://wiki.cowboy-of-bottrop.de/index.php?title=Hilfe:CSS&amp;diff=6016&amp;oldid=prev</id>
		<title>Cowboy: Die Seite wurde neu angelegt: „{{Hilfe}} &#039;&#039;&#039;CSS&#039;&#039;&#039; ({{WP|Cascading Style Sheets}}) ist eine Technik, mit der sich Wiki-Seiten wie auch Seiten im Internet allgemein mit Farben und Layout-Spezifikationen versehen lassen.  Es gibt folgende Möglichkeiten: # Das {{WP|Layout}} eines einzelnen Artikels beeinflussen. Das ist Gegenstand dieser Hilfeseite. # Alle Wiki-Seiten mit einem schematischen Stil versehen #* für die persönlichen Wünsche einzelner Benutzer. #* für das ganze Projekt (n…“</title>
		<link rel="alternate" type="text/html" href="https://wiki.cowboy-of-bottrop.de/index.php?title=Hilfe:CSS&amp;diff=6016&amp;oldid=prev"/>
		<updated>2026-08-13T14:54:47Z</updated>

		<summary type="html">&lt;p&gt;Die Seite wurde neu angelegt: „{{Hilfe}} &amp;#039;&amp;#039;&amp;#039;CSS&amp;#039;&amp;#039;&amp;#039; ({{WP|Cascading Style Sheets}}) ist eine Technik, mit der sich Wiki-Seiten wie auch Seiten im Internet allgemein mit Farben und Layout-Spezifikationen versehen lassen.  Es gibt folgende Möglichkeiten: # Das {{WP|Layout}} eines einzelnen Artikels beeinflussen. Das ist Gegenstand dieser Hilfeseite. # Alle Wiki-Seiten mit einem schematischen Stil versehen #* für die persönlichen Wünsche einzelner Benutzer. #* für das ganze Projekt (n…“&lt;/p&gt;
&lt;p&gt;&lt;b&gt;Neue Seite&lt;/b&gt;&lt;/p&gt;&lt;div&gt;{{Hilfe}}&lt;br /&gt;
&amp;#039;&amp;#039;&amp;#039;CSS&amp;#039;&amp;#039;&amp;#039; ({{WP|Cascading Style Sheets}}) ist eine Technik, mit der sich Wiki-Seiten wie auch Seiten im Internet allgemein mit Farben und Layout-Spezifikationen versehen lassen.&lt;br /&gt;
&lt;br /&gt;
Es gibt folgende Möglichkeiten:&lt;br /&gt;
# Das {{WP|Layout}} eines einzelnen Artikels beeinflussen. Das ist Gegenstand dieser Hilfeseite.&lt;br /&gt;
# Alle Wiki-Seiten mit einem schematischen Stil versehen&lt;br /&gt;
#* für die persönlichen Wünsche einzelner Benutzer.&lt;br /&gt;
#* für das ganze Projekt (nur bestimmten dazu berechtigten Benutzern möglich) oder in der weltweit eingesetzten Software; siehe [[CowboysWiki:Technik/Skin/MediaWiki/Ressourcen|MediaWiki/Ressourcen]].&lt;br /&gt;
{{Hilfeseite-Projektseite|1=&lt;br /&gt;
Die individuelle, persönliche Gestaltung der Wiki-Seiten wird unter &amp;#039;&amp;#039;&amp;#039;[[CowboysWiki:Technik/Skin/CSS|CW:CSS]]&amp;#039;&amp;#039;&amp;#039; beschrieben.&lt;br /&gt;
}}&lt;br /&gt;
&lt;br /&gt;
== Formatierung im Quelltext einer Seite ==&lt;br /&gt;
Ausdrücklich angegebene Stilvorgaben in einem einzelnen Element überschreiben (fast&amp;lt;ref&amp;gt;Ausnahme: Sogenanntes &amp;lt;code&amp;gt;!important&amp;lt;/code&amp;gt;&amp;lt;/ref&amp;gt; immer) die allgemeinen Vorgaben für die Seite.&lt;br /&gt;
&lt;br /&gt;
Die Angaben werden in einem Attribut &amp;lt;code&amp;gt;style=&amp;quot;&amp;quot;&amp;lt;/code&amp;gt; gemacht, wobei zwischen den Anführungszeichen die CSS-Deklaration angegeben wird.&lt;br /&gt;
&lt;br /&gt;
Es gibt zwei Möglichkeiten, im Wikitext diese Anweisung zu geben:&lt;br /&gt;
# Tabellen-Elemente; namentlich &amp;lt;code&amp;gt;{|&amp;lt;/code&amp;gt;&amp;amp;nbsp;für die gesamte Tabelle, &amp;lt;code&amp;gt;|-&amp;lt;/code&amp;gt;&amp;amp;nbsp;für eine ganze Tabellenzeile, zwischen zwei &amp;lt;code&amp;gt;|&amp;lt;/code&amp;gt; für eine einzelne Tabellenzelle. Näheres siehe [[Hilfe:Tabellen]].&lt;br /&gt;
# [[Hilfe:Tags|Tags]] wie &amp;lt;code&amp;gt;&amp;amp;lt;span&amp;gt;&amp;lt;/code&amp;gt; – die meisten dieser Elemente lassen ein &amp;lt;code&amp;gt;style=&amp;lt;/code&amp;gt;-Attribut zu; stellen es dann auch dar, sofern möglich.&lt;br /&gt;
#* &amp;lt;code&amp;gt;&amp;amp;lt;span &amp;#039;&amp;#039;&amp;#039;style=&amp;quot;color: blue&amp;quot;&amp;#039;&amp;#039;&amp;#039;&amp;gt;...&amp;amp;lt;/span&amp;gt;&amp;lt;/code&amp;gt;&lt;br /&gt;
&lt;br /&gt;
== CSS-Notation ==&lt;br /&gt;
Es wird einem Schlüsselwort ein Wert zugewiesen, wobei diese beiden durch einen Doppelpunkt getrennt werden.&lt;br /&gt;
* &amp;lt;code&amp;gt;style=&amp;quot;Eigenschaft: Wert&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
Es gibt eine Vielzahl von Eigenschaften. Jeweils paarweise wird der Eigenschaft der gewünschte Wert zugewiesen. Aufeinander folgende Paare werden durch ein Semikolon getrennt; damit man es beim Ändern nicht vergisst, wird oft hinter das letzte Paar ein eigentlich unnötiges Semikolon gesetzt:&lt;br /&gt;
* &amp;lt;code&amp;gt;style=&amp;quot;Eigenschaft1: Wert1; Eigenschaft2: Wert2;&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
Die Leerzeichen im Beispiel sind optional und werden auf dieser Seite zur besseren Lesbarkeit gesetzt. Kompakte Zuweisungen von einem Namen und einem Wert werden meist ohne Leerzeichen und Semikolon geschrieben; mehrere Zuweisungen auch mit komplexen Werten dagegen durch Leerzeichen besser lesbar gemacht.&lt;br /&gt;
&lt;br /&gt;
Ein häufiger Wert sind Farben. Sie werden am sichersten als Hexadezimalzahlen angegeben: &amp;lt;code&amp;gt;#RRGGBB&amp;lt;/code&amp;gt;&amp;amp;nbsp;– mit R=rot, G=grün, B=blau; jeweils sind die Zeichen 0–9,A–F möglich. Näheres siehe [[Hilfe:Farbtabelle]] und weitere.&lt;br /&gt;
&lt;br /&gt;
Ebenfalls häufig sind Längenangaben. Hier sind typisch:&lt;br /&gt;
* &amp;lt;code&amp;gt;%&amp;lt;/code&amp;gt; – relative Angabe, beispielsweise &amp;lt;code&amp;gt;50%&amp;lt;/code&amp;gt; (kein Leerzeichen zwischen Zahl und Prozentzeichen!)&lt;br /&gt;
* &amp;lt;code&amp;gt;em&amp;lt;/code&amp;gt; – ({{WP|Geviert (Typografie)|Geviert}}), etwas wie die Schrifthöhe oder Breite eines großen&amp;amp;nbsp;M: &amp;lt;code&amp;gt;5em&amp;lt;/code&amp;gt;&lt;br /&gt;
* &amp;lt;code&amp;gt;px&amp;lt;/code&amp;gt; – [[Pixel]], etwa &amp;lt;code&amp;gt;20px&amp;lt;/code&amp;gt;&lt;br /&gt;
&lt;br /&gt;
== Klassen und Stile ==&lt;br /&gt;
Statt Elemente auf mehreren Seiten jeweils einzeln mit individuellen Stilen zu versehen, ist es oft günstiger, auf projektweit einheitliche Stil-Definitionen zurückzugreifen. Damit erhalten alle Seiten ein einheitliches Erscheinungsbild, und es sind notfalls Anpassungen an Mobilgeräte oder Erfordernisse bestimmter Benutzergruppen zentral möglich.&lt;br /&gt;
* Hintergrund- und Rahmenfarben, siehe [[Hilfe:Farbe#Hintergrundfarben|Hilfe:Farbe]]&lt;br /&gt;
* Layoutfluss mittels &amp;lt;code&amp;gt;float-right&amp;lt;/code&amp;gt; etc., siehe [[#flow|unten]]&lt;br /&gt;
* Tabellenformate mit &amp;lt;code&amp;gt;wikitable&amp;lt;/code&amp;gt;, &amp;lt;code&amp;gt;toptextcells&amp;lt;/code&amp;gt; und mehr, siehe [[Hilfe:Tabellen#CSS.class|Hilfe:Tabellen]]&lt;br /&gt;
Die Angabe erfolgt analog zur Vereinbarung individueller Stile in einem Attribut &amp;lt;code&amp;gt;class=&amp;quot;…&amp;quot;&amp;lt;/code&amp;gt; und ist an den gleichen Stellen alternativ und zusätzlich möglich.&lt;br /&gt;
&lt;br /&gt;
Mehrere Klassen werden ohne Komma hintereinander, nur durch Leerzeichen getrennt innerhalb desselben und einzigen Attributs &amp;lt;code&amp;gt;class=&amp;quot;…&amp;quot;&amp;lt;/code&amp;gt; angegeben.&lt;br /&gt;
&lt;br /&gt;
Ist eine Eigenschaft sowohl durch &amp;lt;code&amp;gt;class=&amp;quot;…&amp;quot;&amp;lt;/code&amp;gt; als auch durch &amp;lt;code&amp;gt;style=&amp;quot;…&amp;quot;&amp;lt;/code&amp;gt; bestimmt, hat die Definition mit &amp;lt;code&amp;gt;style&amp;lt;/code&amp;gt; den Vorrang.&lt;br /&gt;
&lt;br /&gt;
== Häufige Aufgaben ==&lt;br /&gt;
Hier eine kurze Auswahl.&lt;br /&gt;
&lt;br /&gt;
=== {{Anker|align}} Anordnung des Textes ===&lt;br /&gt;
Es gibt zwei Richtungen, die beispielsweise in Tabellenzellen hilfreich sind:&lt;br /&gt;
# horizontal&lt;br /&gt;
#* &amp;lt;code&amp;gt;style=&amp;quot;text-align: left&amp;quot;&amp;lt;/code&amp;gt; – &amp;#039;&amp;#039;linksbündig&amp;#039;&amp;#039;&lt;br /&gt;
#* &amp;lt;code&amp;gt;style=&amp;quot;text-align: center&amp;quot;&amp;lt;/code&amp;gt; – &amp;#039;&amp;#039;mittig&amp;#039;&amp;#039; – Alternativ: &amp;lt;code&amp;gt;class=&amp;quot;center&amp;quot;&amp;lt;/code&amp;gt; (zieht eine Tabelle gleichzeitig auf die volle Seitenbreite aus; nicht zu verwechseln mit &amp;lt;code&amp;gt;class=&amp;quot;centered&amp;quot;&amp;lt;/code&amp;gt;)&amp;amp;nbsp;– siehe [[Hilfe:Textgestaltung/Zentrieren|Zentrieren]]&lt;br /&gt;
#* &amp;lt;code&amp;gt;style=&amp;quot;text-align: right&amp;quot;&amp;lt;/code&amp;gt; – &amp;#039;&amp;#039;rechtsbündig&amp;#039;&amp;#039;&lt;br /&gt;
# vertikal&lt;br /&gt;
#* &amp;lt;code&amp;gt;style=&amp;quot;vertical-align: top&amp;quot;&amp;lt;/code&amp;gt; – &amp;#039;&amp;#039;oben&amp;#039;&amp;#039;&lt;br /&gt;
#* &amp;lt;code&amp;gt;style=&amp;quot;vertical-align: middle&amp;quot;&amp;lt;/code&amp;gt; – &amp;#039;&amp;#039;mittig&amp;#039;&amp;#039;&lt;br /&gt;
#* &amp;lt;code&amp;gt;style=&amp;quot;vertical-align: bottom&amp;quot;&amp;lt;/code&amp;gt; – &amp;#039;&amp;#039;unten&amp;#039;&amp;#039;&lt;br /&gt;
&lt;br /&gt;
=== {{Anker|flow}} Layout, Textfluss und zurücksetzen ===&lt;br /&gt;
Siehe insgesamt: [[Hilfe:Textgestaltung/Layoutfluss|Layoutfluss]]&lt;br /&gt;
* Element am rechten Seitenrand anordnen und vom Text umfließen lassen:&lt;br /&gt;
** &amp;lt;code&amp;gt;style=&amp;quot;float: right&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
** &amp;lt;code&amp;gt;class=&amp;quot;float-right&amp;quot;&amp;lt;/code&amp;gt; – &amp;#039;&amp;#039;besser; vor allem, wenn es schon eine Klasse gibt; sorgt außerdem für einen Abstand zum [[Fließtext]]&amp;#039;&amp;#039;&lt;br /&gt;
** Miniaturbilder werden standardmäßig auf diese Weise deklariert.&lt;br /&gt;
* Genauso für den linken Seitenrand:&lt;br /&gt;
** &amp;lt;code&amp;gt;style=&amp;quot;float: left&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
** &amp;lt;code&amp;gt;class=&amp;quot;float-left&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
* Gesamtes Element mittig ausrichten:&lt;br /&gt;
** &amp;lt;code&amp;gt;class=&amp;quot;centered&amp;quot;&amp;lt;/code&amp;gt; (nicht zu verwechseln mit &amp;lt;code&amp;gt;class=&amp;quot;center&amp;quot;&amp;lt;/code&amp;gt;)&amp;amp;nbsp;– siehe [[Hilfe:Textgestaltung/Zentrieren|Zentrieren]]&lt;br /&gt;
* Layoutfluss zurücksetzen&lt;br /&gt;
*: &amp;lt;code&amp;gt;&amp;amp;lt;div style=&amp;quot;clear: both;&amp;quot;&amp;gt;&amp;amp;lt;/div&amp;gt;&amp;lt;/code&amp;gt;&lt;br /&gt;
&lt;br /&gt;
=== {{Anker|color}} Farben ===&lt;br /&gt;
* Hintergrundfarbe:&lt;br /&gt;
** &amp;lt;code&amp;gt;style=&amp;quot;background: black&amp;quot;&amp;lt;/code&amp;gt;&amp;lt;ref name=&amp;quot;background-color&amp;quot; /&amp;gt;&lt;br /&gt;
** &amp;lt;code&amp;gt;class=&amp;quot;hintergrundfarbe6&amp;quot;&amp;lt;/code&amp;gt; – &amp;lt;span class=&amp;quot;hintergrundfarbe6&amp;quot;&amp;gt;Beispiel&amp;lt;/span&amp;gt;&amp;amp;nbsp;– [[Hilfe:Farbe#Hintergrundfarben|Hilfe]]&lt;br /&gt;
* Schriftfarbe:&lt;br /&gt;
** &amp;lt;code&amp;gt;style=&amp;quot;color: #8B008B&amp;quot;&amp;lt;/code&amp;gt; – &amp;lt;span style=&amp;quot;color: #8B008B&amp;quot;&amp;gt;Beispiel&amp;lt;/span&amp;gt;&lt;br /&gt;
* Rahmenfarbe und mehr:&lt;br /&gt;
** &amp;lt;code&amp;gt;style=&amp;quot;border: solid 1px #9932CC&amp;quot;&amp;lt;/code&amp;gt; – &amp;lt;span style=&amp;quot;border: solid 1px #9932CC&amp;quot;&amp;gt;Beispiel&amp;lt;/span&amp;gt;&lt;br /&gt;
** &amp;lt;code&amp;gt;class=&amp;quot;rahmenfarbe4&amp;quot;&amp;lt;/code&amp;gt; – &amp;lt;span class=&amp;quot;rahmenfarbe4&amp;quot; style=&amp;quot;border-style: solid; border-width: 1px;&amp;quot;&amp;gt;Beispiel&amp;lt;/span&amp;gt;&amp;amp;nbsp;– [[Hilfe:Farbe#Rahmenfarben|Hilfe]]&lt;br /&gt;
&lt;br /&gt;
=== {{Anker|nowrap}} Zeilenumbruch unterdrücken ===&lt;br /&gt;
Mehrfache &amp;lt;code&amp;gt;&amp;amp;amp;nbsp;&amp;lt;/code&amp;gt; ([[Geschütztes Leerzeichen|geschützte Leerzeichen]]) können eingespart werden.&lt;br /&gt;
* &amp;lt;code&amp;gt;style=&amp;quot;white-space: nowrap&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
&lt;br /&gt;
=== {{Anker|margin}} Einrückung, linker Rand ===&lt;br /&gt;
Bei jeder Einrückung in Aufzählungen usw. wird um &amp;lt;code&amp;gt;2em&amp;lt;/code&amp;gt; (zweimal die Breite eines&amp;amp;nbsp;„M“) der linke Rand nach rechts verschoben.&lt;br /&gt;
* &amp;lt;code&amp;gt;style=&amp;quot;margin-left: 2em&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
&lt;br /&gt;
=== {{Anker|none}} Ausblendung (unsichtbar/sichtbar) ===&lt;br /&gt;
Gelegentlich werden Textelemente von vornherein unsichtbar gemacht. Skripte und Konfigurationseinflüsse sorgen später unter bestimmten Bedingungen dafür, dass sie wieder sichtbar werden:&lt;br /&gt;
* &amp;lt;code&amp;gt;style=&amp;quot;display: none&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
&lt;br /&gt;
== Allgemeine Gestaltungs-Prinzipien ==&lt;br /&gt;
&lt;br /&gt;
„Weniger ist mehr.“ Enzyklopädische Seiten konzentrieren sich auf den Inhalt und sind schlicht gestaltet. Übermäßige Verwendung von CSS-Deklarationen in den Artikeln kann von den Inhalten ablenken und macht den Quelltext für anderen Autoren schwer zu lesen und zu pflegen. Im Zweifelsfall kann auf [[Hilfe:Vorlagen|Vorlagen]] zurückgegriffen werden; auch dort sollte man sich aber auf das Notwendige beschränken.&lt;br /&gt;
&lt;br /&gt;
== Veraltete Anweisungen ==&lt;br /&gt;
&lt;br /&gt;
In den 1990er Jahren, bevor sich CSS durchsetzte, wurden in [[Hypertext Markup Language|HTML]] noch besondere Attribute für jede einzelne Eigenschaft definiert. Diese sind aber nicht so reichhaltig wie die Möglichkeiten von CSS. Man geht deshalb inzwischen davon ab und verwendet nur noch das Universal-Attribut &amp;lt;code&amp;gt;style=&amp;lt;/code&amp;gt; und einheitlich in allen Situationen CSS. Einige häufige Fälle:&lt;br /&gt;
&lt;br /&gt;
{| class=&amp;quot;wikitable toptextcells sortable&amp;quot;&lt;br /&gt;
|-&lt;br /&gt;
! Veraltet&lt;br /&gt;
!class=&amp;quot;unsortable&amp;quot;| Bedeutung&lt;br /&gt;
!class=&amp;quot;unsortable&amp;quot;| Ersatz durch CSS&lt;br /&gt;
!class=&amp;quot;unsortable&amp;quot;| Werte und Anmerkungen&lt;br /&gt;
|-&lt;br /&gt;
| &amp;lt;code&amp;gt;bgcolor=&amp;quot;&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
| Hintergrundfarbe&lt;br /&gt;
| &amp;lt;code&amp;gt;background:&amp;lt;/code&amp;gt;&amp;lt;ref name=&amp;quot;background-color&amp;quot; /&amp;gt;&lt;br /&gt;
| Farbwerte&lt;br /&gt;
|-&lt;br /&gt;
| &amp;lt;code&amp;gt;align=&amp;quot;&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
| Textausrichtung (horizontal)&lt;br /&gt;
| &amp;lt;code&amp;gt;text-align:&amp;lt;/code&amp;gt;&amp;lt;br /&amp;gt; &amp;lt;code&amp;gt;float:&amp;lt;/code&amp;gt;&lt;br /&gt;
| &amp;lt;code&amp;gt;left center right&amp;lt;/code&amp;gt;&amp;lt;br /&amp;gt;&lt;br /&gt;
Unterschiedliche Wirkung, je nachdem ob ein Block-Element oder aber eine Tabellenzeile bzw. -zelle adressiert wird.&lt;br /&gt;
&lt;br /&gt;
Bei Anwendung auf gesamte Tabelle nach&amp;amp;nbsp;&amp;lt;code&amp;gt;{|&amp;lt;/code&amp;gt;:&lt;br /&gt;
* &amp;lt;code&amp;gt;text-align:center&amp;lt;/code&amp;gt; – wirkt auf alle Zellen&lt;br /&gt;
* &amp;lt;code&amp;gt;class=&amp;quot;center&amp;quot;&amp;lt;/code&amp;gt; – wirkt auf alle Zellen, zieht gleichzeitig die Tabelle auf volle Seitenbreite&lt;br /&gt;
* &amp;lt;code&amp;gt;class=&amp;quot;centered&amp;quot;&amp;lt;/code&amp;gt; – zieht die Tabelle auf volle Seitenbreite (nicht den Text)&lt;br /&gt;
siehe [[Hilfe:Textgestaltung/Zentrieren|Zentrieren]]&lt;br /&gt;
&lt;br /&gt;
Für Block-Elemente beeinflussen &amp;lt;code&amp;gt;align=&amp;quot;right&amp;quot;&amp;lt;/code&amp;gt; bzw. &amp;lt;code&amp;gt;align=&amp;quot;left&amp;quot;&amp;lt;/code&amp;gt; hingegen den [[Hilfe:Textgestaltung/Layoutfluss#clear|Layoutfluss]].&lt;br /&gt;
|-&lt;br /&gt;
| &amp;lt;code&amp;gt;valign=&amp;quot;&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
| Textausrichtung (vertikal)&lt;br /&gt;
| &amp;lt;code style=&amp;quot;white-space: nowrap&amp;quot;&amp;gt;vertical-align:&amp;lt;/code&amp;gt;&lt;br /&gt;
| &amp;lt;code&amp;gt;top middle bottom&amp;lt;/code&amp;gt;&lt;br /&gt;
|-&lt;br /&gt;
| &amp;lt;code&amp;gt;clear=&amp;quot;&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
| Layoutfluss zurücksetzen&lt;br /&gt;
|colspan=&amp;quot;2&amp;quot;| &amp;lt;code&amp;gt;[[Hilfe:Textgestaltung/Layoutfluss#clear|&amp;amp;lt;div style=&amp;quot;clear: both;&amp;quot;&amp;gt;&amp;amp;lt;/div&amp;gt;]]&amp;lt;/code&amp;gt;&lt;br /&gt;
|-&lt;br /&gt;
| &amp;lt;code&amp;gt;border=&amp;quot;1&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
| Umrandung&lt;br /&gt;
| &amp;lt;code style=&amp;quot;white-space: nowrap&amp;quot;&amp;gt;border: solid 1px&amp;lt;/code&amp;gt;&lt;br /&gt;
| Oft überflüssig, etwa bei &amp;lt;code&amp;gt;class=&amp;quot;wikitable&amp;quot;&amp;lt;/code&amp;gt;.&lt;br /&gt;
|-&lt;br /&gt;
| &amp;lt;code&amp;gt;cellpadding=&amp;quot;10&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
| Innerer Abstand&lt;br /&gt;
| &amp;lt;code style=&amp;quot;white-space: nowrap&amp;quot;&amp;gt;padding: 10px&amp;lt;/code&amp;gt;&lt;br /&gt;
| Oft überflüssig, etwa bei &amp;lt;code&amp;gt;class=&amp;quot;wikitable&amp;quot;&amp;lt;/code&amp;gt;.&lt;br /&gt;
|-&lt;br /&gt;
| &amp;lt;code&amp;gt;cellspacing=&amp;quot;5&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
| Abstand zwischen Zellen&lt;br /&gt;
| &amp;lt;code style=&amp;quot;white-space: nowrap&amp;quot;&amp;gt;border-collapse: separate;&amp;lt;/code&amp;gt; &amp;lt;code style=&amp;quot;white-space: nowrap&amp;quot;&amp;gt;border-spacing: 5px;&amp;lt;/code&amp;gt;&lt;br /&gt;
| Enzyklopädisch kaum wünschenswert&lt;br /&gt;
|-&lt;br /&gt;
| &amp;lt;code&amp;gt;cellspacing=&amp;quot;0&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
| Abstand zwischen Zellen minimieren&lt;br /&gt;
| &amp;lt;code style=&amp;quot;white-space: nowrap&amp;quot;&amp;gt;border-collapse: collapse;&amp;lt;/code&amp;gt;&lt;br /&gt;
| Standard bei &amp;lt;code&amp;gt;wikitable&amp;lt;/code&amp;gt;&lt;br /&gt;
|-&lt;br /&gt;
| &amp;lt;code&amp;gt;color=&amp;quot;&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
| Schriftfarbe usw.&lt;br /&gt;
| &amp;lt;code&amp;gt;color:&amp;lt;/code&amp;gt;&lt;br /&gt;
| Farbwerte&lt;br /&gt;
|-&lt;br /&gt;
| &amp;lt;code&amp;gt;width=&amp;quot;20%&amp;quot;&amp;lt;/code&amp;gt;&amp;lt;br /&amp;gt; &amp;lt;code&amp;gt;width=&amp;quot;250&amp;quot;&amp;lt;/code&amp;gt;&lt;br /&gt;
| Breite&lt;br /&gt;
| &amp;lt;code&amp;gt;width: 20%&amp;lt;/code&amp;gt;&amp;lt;br /&amp;gt; &amp;lt;code&amp;gt;width: 250px&amp;lt;/code&amp;gt;&lt;br /&gt;
| In CSS gibt es viele Maßeinheiten, und es muss &amp;lt;code&amp;gt;px&amp;lt;/code&amp;gt; für „Pixel“ gesetzt werden, während es in [[Hypertext Markup Language|HTML]] nur Prozent und Pixel gibt.&lt;br /&gt;
|}&lt;br /&gt;
&lt;br /&gt;
* Achtung: Generell werden HTML-Attribute bei Vorhandensein von entsprechendem CSS wirkungslos, sprich überschrieben.&lt;br /&gt;
* Die Angaben &amp;lt;code&amp;gt;colspan=&amp;lt;/code&amp;gt; und &amp;lt;code&amp;gt;rowspan=&amp;lt;/code&amp;gt; sind strukturelle Eigenschaften und keine bloßen CSS-Dekorationen.&lt;br /&gt;
* Für die Umstellung in Tabellen gibt es eine detaillierte [[Hilfe:Tabellen/Veraltet|Anleitung]].&lt;br /&gt;
Die veralteten Stile haben das Problem, dass sie mit den modernen Definitionen nicht kompatibel sind und bei gemischtem Auftreten das Resultat schwer vorhersagbar und womöglich browserabhängig ist.&lt;br /&gt;
* Moderne Klassendefinitionen und Zuweisungen in übergeordneten Elementen sollen heutzutage Vorrang vor den veralteten HTML-Attributen haben.&lt;br /&gt;
&lt;br /&gt;
Im Übrigen werden bei der seit 1998 veralteten Methodik die Eigenschaften nicht an die Kinder der Elemente vererbt; deshalb ist bei veralteter Syntax zu sehen, dass die Zuweisungen permanent wiederholt werden müssen:&lt;br /&gt;
&amp;lt;syntaxhighlight lang=&amp;quot;wikitext&amp;quot;&amp;gt;&lt;br /&gt;
{|&lt;br /&gt;
|+ Veraltete Syntax&lt;br /&gt;
|-&lt;br /&gt;
|align=&amp;quot;right&amp;quot;|   42&lt;br /&gt;
|align=&amp;quot;right&amp;quot;|   17&lt;br /&gt;
|-&lt;br /&gt;
|align=&amp;quot;right&amp;quot;|    4&lt;br /&gt;
|align=&amp;quot;right&amp;quot;| 4711&lt;br /&gt;
|}&lt;br /&gt;
&amp;lt;/syntaxhighlight&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Die Zuweisung &amp;lt;code&amp;gt;style=&amp;lt;/code&amp;gt; erfolgt einmalig und wirkt sich auf alle Tabellenzellen aus:&lt;br /&gt;
&amp;lt;syntaxhighlight lang=&amp;quot;wikitext&amp;quot;&amp;gt;&lt;br /&gt;
{| style=&amp;quot;text-align:right;&amp;quot;&lt;br /&gt;
|+ Aktuelle Syntax&lt;br /&gt;
|-&lt;br /&gt;
|   42&lt;br /&gt;
|   17&lt;br /&gt;
|-&lt;br /&gt;
|    4&lt;br /&gt;
| 4711&lt;br /&gt;
|}&lt;br /&gt;
&amp;lt;/syntaxhighlight&amp;gt;&lt;br /&gt;
&lt;br /&gt;
== Einige Anleitungen ==&lt;br /&gt;
{{Wikibooks|Websiteentwicklung: CSS|CSS|suffix=-}}&lt;br /&gt;
* [http://wiki.selfhtml.org/wiki/CSS SELFHTML-Wiki] (deutsch)&lt;br /&gt;
* [http://www.edition-w3c.de/TR/REC-CSS2 CSS-2] – offizielle Spezifikation (deutsch)&lt;br /&gt;
* [http://www.w3.org/Style/CSS/ W3C] – offizielle Unterlagen (englisch)&lt;br /&gt;
** [http://www.webmeister.at/Style/CSS/ offizielle Übersetzung] (deutsch)&lt;br /&gt;
&lt;br /&gt;
== Anmerkungen ==&lt;br /&gt;
&amp;lt;references&amp;gt;&lt;br /&gt;
&amp;lt;ref name=&amp;quot;background-color&amp;quot;&amp;gt;&lt;br /&gt;
Etwas detaillierter:&lt;br /&gt;
* Die präzise Farbangabe nur für die Hintergrundfarbe würde etwa lauten: &amp;lt;code style=&amp;quot;white-space: nowrap&amp;quot;&amp;gt;background-color: #FFFF00&amp;lt;/code&amp;gt;&lt;br /&gt;
* Kürzer und in der Regel genauso wirksam ist: &amp;lt;code style=&amp;quot;white-space: nowrap&amp;quot;&amp;gt;background: #FFFF00&amp;lt;/code&amp;gt;&lt;br /&gt;
** Hier kämen noch weitere Spezifikationen für den Hintergrund in Frage, die in der Wikipedia aber eher selten und teilweise unterbunden sind.&lt;br /&gt;
* &amp;lt;code&amp;gt;background-color&amp;lt;/code&amp;gt; ist im Zweifelsfall sicherer als &amp;lt;code&amp;gt;background&amp;lt;/code&amp;gt;.&lt;br /&gt;
* In der Regel und insbesondere im ANR genügt es, &amp;lt;code style=&amp;quot;white-space: nowrap&amp;quot;&amp;gt;background:#FFFF00&amp;lt;/code&amp;gt; zu schreiben. Dies ist übersichtlicher und kürzer.&lt;br /&gt;
* Im Wikitext sind für die &amp;lt;code&amp;gt;style&amp;lt;/code&amp;gt;-Angaben ohnehin keine anderen Spezifikationen als die Farbe sinnvoll wählbar.&lt;br /&gt;
* Lediglich bei [[Hilfe:Tabellen|sortierbaren Tabellen]] muss im Tabellenkopf &amp;lt;code&amp;gt;background-color:&amp;lt;/code&amp;gt; verwendet werden, weil hier später durch [[JavaScript]] die Sortierpfeile als Hintergrundbild generiert werden. Durch&amp;lt;code&amp;gt;background:&amp;lt;/code&amp;gt; wird jedoch ggf. der Browser schon darauf festgelegt, dass kein Hintergrundbild angezeigt werden soll.&lt;br /&gt;
* In der Vorlagenprogrammierung und ähnlich fortgeschrittenem Kontext wird man vorrangig explizit &amp;lt;code&amp;gt;background-color&amp;lt;/code&amp;gt; angeben, um die Wirkung anderweitiger Effekte nicht zu behindern.&lt;br /&gt;
&amp;lt;/ref&amp;gt;&lt;br /&gt;
&amp;lt;/references&amp;gt;&lt;br /&gt;
&amp;lt;noinclude&amp;gt;&lt;br /&gt;
[[Kategorie:Hilfe:Wikisyntax]]&lt;br /&gt;
&amp;lt;/noinclude&amp;gt;&lt;/div&gt;</summary>
		<author><name>Cowboy</name></author>
	</entry>
</feed>