CSS 3, Box- und Textshadow
Textschatten
Endlich braucht man keine Bildbearbeitungssoftware mehr um Text zu gestalten. In CSS3 ist es auch erstmals möglich, einen Text direkt mit einem Schatten zu versehen.
.element {
text-shadow: 2px 2px 2px #000;
}
Der Befehl dazu heisst "text-shadow" und besteht aus 3 Pixelangaben und eine Farbangabe. Die erste Pixelangabe beschreibt die vertikale Positionierung des Schattens, die zweite Angabe die horizontale Positionierung und die Dritte, wie stark der Schatten weichgezeichnet werden soll. Die Farbangabe ist die Farbe des Schattens.
Boxschatten (Outset)
.element {
background-color: #5488CC;
height: 120px; width: 400px;
box-shadow: 3px 3px 8px #000;
}
Boxschatten (Inset)
.element {
background-color: #5488CC;
height: 120px; width: 400px;
box-shadow: inset 3px 3px 8px #000;
}