Platzhalter

 
Platzhalter PlatzhalterPlatzhalter

Farbige Scrollbalken

Platzhalter
 
  Startseite
  eBook-Projekt
  Web-Lexikon
  Bücher bestellen
   
  Design-Theorie
  Design-Praxis
  Promotion
  HTML/XML-Praxis
  Projekt-Management
  Webmaster-Praxis
  Fragen & Antworten
  Technik-Ecke
   
  Portal/Links
  Buch-Rezensionen
  Software
  Impressum
PlatzhalterPlatzhalter







 

Platzhalter Farbige Scrollbalken sieht man derzeit überall. Grund genug für uns, dieses Thema einmal zu behandeln.

Realisiert wird die ganze Sache mit CSS: das Body-Tag hat Attribute, mit denen sich die Scrollbars einfärben lassen. Leider werden farbige Scrollbalken jedoch nur vom Internet Explorer ab Version 5.5 unterstützt.

Will man einer Bildlaufleiste einen grundsätzlich anderen Farbton verpassen, so empfiehlt sich zunächst das Attribut scrollbar-base-color. Die hier festgelegte Farbe gilt dann für die ganze Leiste und wird, um z.B. den 3D-Effekt zu erreichen, noch leicht variiert.

Beispiel:

<html>
<head>
<title>Untitled</title>
<style>
BODY {
scrollbar-base-color: black;
}
</style>
</head>


Wer die Farbgebung in weitergehenden Details beeinflussen möchte, der kann weitere Attribute verwenden. scrollbar-base-color wird damit außer Kraft gesetzt.

Folgende Attribute stehen zur Verfügung:

scrollbar-face-color bestimmt die Farbe des eigentlichen Rollbalkens.

scrollbar-highlight-color bestimmt die Farbe der höhergelegenen Elemente.

scrollbar-shadow-color bestimmt die Farbe der tiefergelegenen Elemente.

scrollbar-3dlight-color bestimmt die Farbe seitlich liegender Elemente.

scrollbar-arrow-color bestimmt die Farbe der Pfeile in den Kopfstücken.

scrollbar-track-color bestimmt die Farbe der Rollbalken-"Schiene".

scrollbar-darkshadow-color bestimmt die Farbe bestimmter seitlich liegender Elemente.

Beispiel:

<html>
<head>
    <title>Untitled</title>
<style>
BODY {
scrollbar-face-color: red;
scrollbar-highlight-color: black;
scrollbar-shadow-color: white;
scrollbar-3dlight-color: white;
scrollbar-arrow-color: black;
scrollbar-track-color: white;
scrollbar-darkshadow-color: black;
scrollbar-base-color: black;
}
</style>
</head>



Autor: Alexander Dilthey | Erstmalig veröffentlicht: 09.07.2001 | Einen Artikel schreiben?

 

Neue Artikel

Rezension: Entwurfsmuster von Kopf bis Fuß
Rezension: Webdesign mit CSS
AJAX - XML und JavaScript in Schönheit vereint?
Rich Email - Flash im Newsletter
Screen Reader Usability
Comment Spam und CAPTCHAs
Logfile-Analyse selbst gemacht - ein Perl-Beispiel

Partnerprogramm




Kommentar

Ist die Freiheit der Informationsgesellschaft in Gefahr?
Derzeit leben wir in einer relativ freien Welt. Doch sind derzeit Tendenzen erkennbar, die Freiheit des Individuums den Interessen der Großindustrie zu opfern. Ein Kommentar.

Druckversion
Sie wollen diese Seite ausdrucken? Dafür haben wir eine spezielle Druckversion ohne grafische Elemente entwickelt!



Einführung in CSS bei HTMLWorld.