Steuern von Darstellungen mit Formatvorlagen
Cascading Stylesheets (CSS) ermöglichen es Ihnen, die Darstellung Ihrer Webseiten zu steuern. Mithilfe eines Cascading Stylesheets können Sie die Position und Darstellungsweise von Elementen einer Webseite genau festlegen.
Ein Cascading Stylesheet kann extern, intern, inline oder relativ zu einer Webseite sein. Eine Webseite kann mehrere dieser CSS-Typen gleichzeitig verwenden. Normalerweise haben Formatvorlagen, die in einem Cascading Inline-Stylesheet definiert wurden, Vorrang vor Formatvorlagen in internen und externen Cascading Stylesheets. Formatvorlagen in einem internen Cascading Stylesheet haben Vorrang vor Formatvorlagen in einem externen Cascading Stylesheet.
Externe Cascading Stylesheets
Verwenden Sie ein externes Stylesheet, wenn Sie dieselben Formatvorlagen konsistent über einige oder alle Webseiten in Ihrer Site hinweg anwenden möchten. Durch das Definieren von Formatvorlagen in einem oder mehreren externen Stylesheets und das Zuordnen dieser Stylesheets zu Webseiten können Sie sicherstellen, dass Ihre gesamte Site über eine konsistente Darstellungsweise verfügt. Wenn Sie ein Format ändern möchten, müssen Sie nur eine Änderung vornehmen - im externen Cascading Stylesheet - und die Änderung wird automatisch für alle Webseiten übernommen, die auf dieses Format und das Cascading Stylesheet verweisen.
Ein externes Cascading Stylesheet befindet sich in einer CSS-Datei, wie zum Beispiel global.css. Die Syntax eines externen Cascading Stylesheets ist mit der eines internen Cascading Stylesheets gleich (Sie finden ein Beispiel dazu im nächsten Abschnitt des aktuellen Themas), mit der Ausnahme, dass die in einem externen Cascading Stylesheet definierten Formatvorlagen nicht von <style>-Tags umschlossen sind.
Interne Cascading Stylesheets
Verwenden Sie ein internes Cascading Stylesheet, das manchmal auch als eingebettetes Cascading Stylesheet bezeichnet wird, wenn Sie Formatvorlagen nur für die aktuelle Webseite definieren möchten und wenn Sie die Formatvorlagen außer Kraft setzen möchten, die in einem externen, an die Webseite angehängten Cascading Stylesheet definiert sind.
Ein internes Cascading Stylesheet befindet sich innerhalb der <head>-Tags einer Webseite.
<style type="text/css">
.alert {
font-weight: bold;
color: #FF0000;
}
h1 {
font-size: 16pt;
font-family: Arial, Helvetica, sans-serif;
}
#headlines {
border-color: #000000;
border-width: thin;
border-style: solid;
}
</style>
Cascading Inline-Stylesheet
Verwenden Sie eine Inlineformatvorlage, um Cascading Stylesheet-Eigenschaften auf einzelne Elemente einer Seite anzuwenden, wenn die Formatvorlage nicht wiederverwendet wird. Eine Inlineformatvorlage wird innerhalb des Starttags eines HTML-Elements der Webseite definiert
<p style="font-weight: bold; font-style: italic; color: #FF0000;">
Siehe auch
Aufgaben
Erstellen eines Cascading Stylesheets