Für ein modernes CSS-Design in APEX müssen folgende Regeln beachtet werden:
Anstatt:
<p style="background-color: red;">
Besser:
<p class="roterAbsatz">
Und in der CSS-Datei:
.roterAbsatz{background-color: red;}
Um eine CSS-Anweisung einem HTML-Befehl zuzuweisen sind folgende Möglichkeiten gegeben:
Variante 1
Über eine ID – Diese muss einmalig im gesamten HTML-Dokument sein.
CSS-Datei:
#name {background-color: red;}
HTML-Datei:
<div id="name">
Die Raute (#) vor dem Namen in der CSS-Datei gibt an, dass es sich um eine ID handelt.
Variante 2
Über eine Klasse (class) – Diese kann mehrmals im Dokument verwendet werden.
CSS-Datei:
.name {background-color: red;}
HTML-Datei:
<div class="name">
Der Punkt vor dem Namen in der CSS-Datei gibt an, dass es sich um eine Klasse handelt.
Variante 3
Über den Namen (Tag) des HTML-Befehls.
CSS-Datei:
h1 {background-color: red;}
HTML-Datei:
<h1>Meine Überschrift</h1>
Hier gilt die CSS-Anweisung für jede Überschrift der ersten Ordnung (h1) des gesamten HTML-Dokuments.
Der grundsätzliche Aufbau einer CSS-Anweisung besteht aus den folgenden Elementen:
Selektor { Eigenschaft: Wert; }
Der Selektor ist der Name eines HTML-Befehls oder ein frei gewählter Name für ein Element. Bei der Wahl des Namens sollte auf die Namenskonventionen geachtet werden. Sonst kann es zu Fehlern kommen, bei denen eine CSS-Anweisung von einem bestimmten Browser nicht interpretiert wird.
Die Eigenschaft ist das Schlüsselwort des Elementes, das verändert werden soll. Der Wert setzt sich aus Zahlen, Schlüsselwörtern oder Strings zusammen:
Beispiele:
background-color: red;
font-family: 'Courier New', serif;
border-width: 1px;
Grundsätzlich muss sehr auf die Syntax geachtet werden. Die Klammern, Doppelpunkte und Strichpunkte müssen an den richtigen Positionen angegeben werden.
#name {background-color: red;}
Eine einzeilige Darstellung ist genauso erlaubt wie beliebig viele Leerzeichen, Tabs und Zeilenumbrüche.
#name
{
background-color: red;
}
Das Thema CSS bietet weitaus mehr, als in diesem Beitrag angeschnitten wurde. Weitere Informationen zu diesem interessanten Thema erhalten Sie in unseren APEX-Schulungen oder Sie sprechen mit unseren Consulting-Mitarbeitern.
In unserer Know-How Datenbank finden Sie mehr als 300 ausführliche Beiträge zu den
Oracle-Themen wie DBA, SQL, PL/SQL, APEX und vielem mehr.
Hier erhalten Sie Antworten auf Ihre Fragen.