CSS - Versionsgeschichte

Linus am 26. Februar 2016 um 11:04 Uhr

2016-02-26T11:04:27Z

← Nächstältere Version		Version vom 26. Februar 2016, 11:04 Uhr
Zeile 3:		Zeile 3:

	== Warum CSS? ==		== Warum CSS? ==
	Es gibt viele Gründe, CSS anstelle von [[HTML]]-Styles zu verwenden. Beispielsweise kann man über eine externe CSS-Datei, die man in allen Seiten einer Homepage einbindet, den gesamten Style bestimmen. Will man das Design verändern reicht eine einzige Änderung in dieser Datei.		Es gibt viele Gründe, CSS anstelle von [[HTML]]-Styles zu verwenden. Beispielsweise kann man über eine externe CSS-Datei, die man in allen Seiten einer Homepage einbindet, den gesamten Style bestimmen. Will man das Design verändern reicht eine einzige Änderung in dieser Datei. Sollte dies nicht möglich sein besteht die Möglichkeit, CSS innerhalb eines <code><style></code>-Tags innerhalb des <code><head></code>-blocks zu hinterlegen. Als letzte Alternative unterstützt beinahe jedes HTML-Tag das <code>style</code>-Attribut, diese Variante sollte aber nur als Notlösung benutzt werden, da sie sehr unflexibel ist.
	~~Weiterhin lassen es sich alle~~ CSS-~~Befehle auf nahezu~~ jedes HTML-Tag ~~anwenden. Während mit reinem HTML beispielsweise die Textfarbe~~ nur ~~in font-Tags angegeben~~ werden ~~kann~~, ist ~~die CSS-Angabe für fast alle Elemente möglich (Tabellen, Text-Absätze, Buttons, Eingabefelder, usw.)~~.

	== Wie verwende ich es? ==		== Wie verwende ich es? ==
	CSS-Codes werden, vergleichbar mit [[Javascript]], entweder in einer externen Datei abgelegt und im Head des Dokuments verlinkt.		CSS-Codes werden, vergleichbar mit [[Javascript]], entweder in einer externen Datei abgelegt und im Head des Dokuments verlinkt.
	Das kann so aussehen:		Das kann so aussehen:
	<~~code~~>		<pre>
	<link rel="stylesheet" type="text/css" href="/style.css">		<link rel="stylesheet" type="text/css" href="/style.css">
	</~~code~~>		</pre>

	Oder sie werden direkt in den HTML-Code eingebunden. Dazu wird entweder ein style-Tag im Head genutzt,		Oder sie werden direkt in den HTML-Code eingebunden. Dazu wird entweder ein style-Tag im Head genutzt,
	<~~code~~>		<pre>
	<style type="text/css">		<style type="text/css">
	body {		body {
	background-color: #ff6600; /* Hintergrundfarbe: orange */		background-color: #ff6600; /* Hintergrundfarbe: orange */
	color: #00ffff; /* Textfarbe: türkis */		color: #00ffff; /* Textfarbe: türkis */
	text-align: center; /* Ausrichtung: Zentriert */		text-align: center; /* Ausrichtung: Zentriert */
	}		}
	</style>		</style>
	</~~code~~>		</pre>

	oder das style-Attribut direkt im betroffenen HTML-Tag.		oder das style-Attribut direkt im betroffenen HTML-Tag.
	<~~code~~>		<pre>
	<body style="background-color: #ff6600; color: #00ffff; text-align: center;">		<body style="background-color: #ff6600; color: #00ffff; text-align: center;">
	</~~code~~>		</pre>

	~~Die beiden Beispiele bewirken das gleiche. Eine Angabe im Head bietet aber mehr Möglichkeiten, z.B. Mouse-Over-Effekte und Bestimmen von CSS-Klassen.~~

	~~Von Webkicks' Seite wird im Chat auch CSS angewandt. Sowohl für die Nutzer als auch für die [[Administrator\|Administratoren]] hat das aber wenig Bedeutung.~~

	~~Selbst können Admins beispielsweise Stylesheets in der [[Ankündigung]] einsetzen um das Hintergrundbild zu fixieren:~~
	~~<code>~~
	~~<style type="text/css">body{background-attachment: fixed;}</style>~~
	~~</code>~~
	Genaugenommen sind solche Angaben nicht Standardgerecht, da sich die Ankündigung im Body des Dokuments befindet und diese Form der CSS-Angaben in den Head gehört, die [[Browser]] tolerieren das jedoch in der Regel ohne Probleme.

	== Weblinks ==		== Weblinks ==
	~~http~~://de.~~selfhtml~~.org/~~css~~/~~index.htm ein nützliches Nachschlagewerk für~~ CSS~~-Befehle~~		[https://developer.mozilla.org/en-US/docs/Web/CSS Mozilla Developer Network]

	[[Kategorie:Programmieren und Webdesign]]		[[Kategorie:Programmieren und Webdesign]]

DarkModi am 11. August 2007 um 17:39 Uhr

2007-08-11T17:39:43Z

← Nächstältere Version		Version vom 11. August 2007, 17:39 Uhr
Zeile 41:		Zeile 41:
	== Weblinks ==		== Weblinks ==
	http://de.selfhtml.org/css/index.htm ein nützliches Nachschlagewerk für CSS-Befehle		http://de.selfhtml.org/css/index.htm ein nützliches Nachschlagewerk für CSS-Befehle

			[[Kategorie:Programmieren und Webdesign]]

D4rkn3ss am 4. Juli 2007 um 17:50 Uhr

2007-07-04T17:50:34Z

← Nächstältere Version		Version vom 4. Juli 2007, 17:50 Uhr
Zeile 10:		Zeile 10:
	Das kann so aussehen:		Das kann so aussehen:
	<code>		<code>
	<link rel="stylesheet" href="/style.css">		<link rel="stylesheet" type="text/css" href="/style.css">
	</code>		</code>

Zeile 16:		Zeile 16:
	<code>		<code>
	<style type="text/css">		<style type="text/css">
	body{		body {
	background-color:#ff6600; /Hintergrundfarbe: orange/		background-color: #ff6600; /* Hintergrundfarbe: orange */
	color:#00ffff; /Textfarbe: türkis/		color: #00ffff; /* Textfarbe: türkis */
	text-align:center; /Ausrichtung: Zentriert/		text-align: center; /* Ausrichtung: Zentriert */
	}		}
	</style>		</style>
Zeile 26:		Zeile 26:
	oder das style-Attribut direkt im betroffenen HTML-Tag.		oder das style-Attribut direkt im betroffenen HTML-Tag.
	<code>		<code>
	<body style="background-color:#ff6600;color:#00ffff;text-align:center;">		<body style="background-color: #ff6600; color: #00ffff; text-align: center;">
	</code>		</code>

Zeile 35:		Zeile 35:
	Selbst können Admins beispielsweise Stylesheets in der [[Ankündigung]] einsetzen um das Hintergrundbild zu fixieren:		Selbst können Admins beispielsweise Stylesheets in der [[Ankündigung]] einsetzen um das Hintergrundbild zu fixieren:
	<code>		<code>
	<style type="text/css">body{background-attachment:fixed;}</style>		<style type="text/css">body{background-attachment: fixed;}</style>
	</code>		</code>
	Genaugenommen sind solche Angaben nicht Standardgerecht, da sich die Ankündigung im Body des Dokuments befindet und diese Form der CSS-Angaben in den Head gehört, die [[Browser]] ~~tollerieren~~ das jedoch in der Regel ohne Probleme.		Genaugenommen sind solche Angaben nicht Standardgerecht, da sich die Ankündigung im Body des Dokuments befindet und diese Form der CSS-Angaben in den Head gehört, die [[Browser]] tolerieren das jedoch in der Regel ohne Probleme.

	== Weblinks ==		== Weblinks ==
	http://de.selfhtml.org/css/index.htm ein nützliches Nachschlagewerk für CSS-Befehle		http://de.selfhtml.org/css/index.htm ein nützliches Nachschlagewerk für CSS-Befehle

195.233.250.7: type="text/css" (nicht text/javascript)

2007-05-23T05:50:22Z

type="text/css" (nicht text/javascript)

← Nächstältere Version		Version vom 23. Mai 2007, 05:50 Uhr
Zeile 35:		Zeile 35:
	Selbst können Admins beispielsweise Stylesheets in der [[Ankündigung]] einsetzen um das Hintergrundbild zu fixieren:		Selbst können Admins beispielsweise Stylesheets in der [[Ankündigung]] einsetzen um das Hintergrundbild zu fixieren:
	<code>		<code>
	<style type="text/~~javascript~~">body{background-attachment:fixed;}</style>		<style type="text/css">body{background-attachment:fixed;}</style>
	</code>		</code>
	Genaugenommen sind solche Angaben nicht Standardgerecht, da sich die Ankündigung im Body des Dokuments befindet und diese Form der CSS-Angaben in den Head gehört, die [[Browser]] tollerieren das jedoch in der Regel ohne Probleme.		Genaugenommen sind solche Angaben nicht Standardgerecht, da sich die Ankündigung im Body des Dokuments befindet und diese Form der CSS-Angaben in den Head gehört, die [[Browser]] tollerieren das jedoch in der Regel ohne Probleme.

DG: Tippfehler

2007-05-07T21:20:42Z

Tippfehler

← Nächstältere Version		Version vom 7. Mai 2007, 21:20 Uhr
Zeile 1:		Zeile 1:
	CSS ist die Abkürzung für "'''C'''ascading '''S'''tyle'''s'''heets.		CSS ist die Abkürzung für <i>'''C'''ascading '''S'''tyle'''s'''heets</i>.
	Sie dienen dazu, den Style von HTML-Elementen zu definieren.		Sie dienen dazu, den Style von HTML-Elementen zu definieren.

DG: Link zur selfHTML-CSS-Referenz korrigiert, Ausdruck eines Satzes verbessert

2007-05-07T20:20:42Z

Link zur selfHTML-CSS-Referenz korrigiert, Ausdruck eines Satzes verbessert

← Nächstältere Version		Version vom 7. Mai 2007, 20:20 Uhr
Zeile 31:		Zeile 31:
	Die beiden Beispiele bewirken das gleiche. Eine Angabe im Head bietet aber mehr Möglichkeiten, z.B. Mouse-Over-Effekte und Bestimmen von CSS-Klassen.		Die beiden Beispiele bewirken das gleiche. Eine Angabe im Head bietet aber mehr Möglichkeiten, z.B. Mouse-Over-Effekte und Bestimmen von CSS-Klassen.

	Im Chat ~~findet~~ CSS ~~auch Anwendung~~. Sowohl für die Nutzer als auch für die [[Administrator\|Administratoren]] hat das aber wenig Bedeutung.		Von Webkicks' Seite wird im Chat auch CSS angewandt. Sowohl für die Nutzer als auch für die [[Administrator\|Administratoren]] hat das aber wenig Bedeutung.

	Selbst können Admins beispielsweise Stylesheets in der [[Ankündigung]] einsetzen um das Hintergrundbild zu fixieren:		Selbst können Admins beispielsweise Stylesheets in der [[Ankündigung]] einsetzen um das Hintergrundbild zu fixieren:
Zeile 40:		Zeile 40:

	== Weblinks ==		== Weblinks ==
	http://de.selfhtml.org/~~navigation~~/~~html~~.htm ein nützliches Nachschlagewerk für CSS-Befehle		http://de.selfhtml.org/css/index.htm ein nützliches Nachschlagewerk für CSS-Befehle

DG: Die Seite wurde neu angelegt: CSS ist die Abkürzung für "'''C'''ascading '''S'''tyle'''s'''heets. Sie dienen dazu, den Style von HTML-Elementen zu definieren. == Warum CSS? == Es gibt viele Grün...

2007-05-07T19:54:50Z

Die Seite wurde neu angelegt: CSS ist die Abkürzung für "'''C'''ascading '''S'''tyle'''s'''heets. Sie dienen dazu, den Style von HTML-Elementen zu definieren. == Warum CSS? == Es gibt viele Grün...

Neue Seite

CSS ist die Abkürzung für "'''C'''ascading '''S'''tyle'''s'''heets.
Sie dienen dazu, den Style von HTML-Elementen zu definieren.

== Warum CSS? ==
Es gibt viele Gründe, CSS anstelle von [[HTML]]-Styles zu verwenden. Beispielsweise kann man über eine externe CSS-Datei, die man in allen Seiten einer Homepage einbindet, den gesamten Style bestimmen. Will man das Design verändern reicht eine einzige Änderung in dieser Datei.
Weiterhin lassen es sich alle CSS-Befehle auf nahezu jedes HTML-Tag anwenden. Während mit reinem HTML beispielsweise die Textfarbe nur in font-Tags angegeben werden kann, ist die CSS-Angabe für fast alle Elemente möglich (Tabellen, Text-Absätze, Buttons, Eingabefelder, usw.).

== Wie verwende ich es? ==
CSS-Codes werden, vergleichbar mit [[Javascript]], entweder in einer externen Datei abgelegt und im Head des Dokuments verlinkt.
Das kann so aussehen:
<code>
<link rel="stylesheet" href="/style.css">
</code>

Oder sie werden direkt in den HTML-Code eingebunden. Dazu wird entweder ein style-Tag im Head genutzt,
<code>
<style type="text/css">
body{
background-color:#ff6600; /*Hintergrundfarbe: orange*/
color:#00ffff; /*Textfarbe: türkis*/
text-align:center; /*Ausrichtung: Zentriert*/
}
</style>
</code>

oder das style-Attribut direkt im betroffenen HTML-Tag.
<code>
<body style="background-color:#ff6600;color:#00ffff;text-align:center;">
</code>

Die beiden Beispiele bewirken das gleiche. Eine Angabe im Head bietet aber mehr Möglichkeiten, z.B. Mouse-Over-Effekte und Bestimmen von CSS-Klassen.

Im Chat findet CSS auch Anwendung. Sowohl für die Nutzer als auch für die [[Administrator|Administratoren]] hat das aber wenig Bedeutung.

Selbst können Admins beispielsweise Stylesheets in der [[Ankündigung]] einsetzen um das Hintergrundbild zu fixieren:
<code>
<style type="text/javascript">body{background-attachment:fixed;}</style>
</code>
Genaugenommen sind solche Angaben nicht Standardgerecht, da sich die Ankündigung im Body des Dokuments befindet und diese Form der CSS-Angaben in den Head gehört, die [[Browser]] tollerieren das jedoch in der Regel ohne Probleme.

== Weblinks ==
http://de.selfhtml.org/navigation/html.htm ein nützliches Nachschlagewerk für CSS-Befehle