1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
---
title: CSS
slug: Glossary/CSS
tags:
- CSS
- CodingScripting
- Glossar
- Web
translation_of: Glossary/CSS
---
<p><span class="seoSummary"><strong>CSS</strong> (Cascading Style Sheets) ist eine deklarative Sprache, die das Aussehen von Webseiten im {{glossary("browser","Browser")}} steuert.</span> Der Browser wendet die CSS-Style-Deklarationen auf gewählte Elemente an, um sie in geeigneter Weise darzustellen. Eine Style-Deklaration beinhaltet die Eigenschaften und deren Werte, die bestimmen, wie eine Webseite aussieht.</p>
<p>CSS ist eine der drei Kern-Webtechnologien; zusammen mit {{Glossary("HTML")}} und {{Glossary("JavaScript")}}. CSS ändert gewöhnlich das Aussehen von {{Glossary("Element","HTML-Elementen")}}, kann aber auch mit anderen Auszeichnungssprachen wie {{Glossary("SVG")}} oder {{Glossary("XML")}} verwendet werden.</p>
<p>Eine CSS-Regel ist ein Satz von {{Glossary("CSS Property","Eigenschaften")}}, verbunden mit einem {{Glossary("selector","Selektor")}}. Hier ist ein Beispiel in dem jeder HTML-Paragraph gelb mit schwarzem Hintergrund eingefärbt wird:</p>
<pre class="brush: css">/* Der Selektor "p" zeigt an, dass alle paragraph-Elemente im Dokument betroffen sein werden */
p {
/* Die "color"-Eigenschaft definiert die Farbe, in diesem Fall gelb (englisch "yellow") */
color: yellow;
/* Die "background-color"-Eigenschaft definiert die Hintergrundfarbe, in diesem Fall schwarz (englisch "black") */
background-color: black
}</pre>
<p>"Cascading" bezieht sich auf die Regeln, welche die Priorisierung der Selektoren festlegen, um das Aussehen einer Seite zu ändern. Dies ist ein sehr wichtiges Feature, da eine komplexe Website tausende von CSS-Regeln besitzen kann.</p>
<h2 id="Erfahre_mehr">Erfahre mehr</h2>
<h3 id="Allgemeinwissen">Allgemeinwissen</h3>
<ul>
<li><a href="/de/Learn/CSS">CSS lernen</a></li>
<li>{{interwiki("wikipedia", "CSS")}} auf Wikipedia</li>
</ul>
<h3 id="Technische_Referenz">Technische Referenz</h3>
<ul>
<li><a href="/de/docs/Web/CSS">Die CSS Dokumentation bei MDN</a></li>
<li><a href="http://www.w3.org/Style/CSS/current-work" rel="external">Die aktuelle Arbeit der CSS Working Group</a> (englisch)</li>
</ul>
<h3 id="Lerne_CSS_kennen">Lerne CSS kennen</h3>
<ul>
<li><a href="http://www.codecademy.com/en/tracks/web" rel="external">Der Webkurs bei codecademy.com</a> (englisch)</li>
</ul>
|