Das Textschatten-Attribut wird verwendet, um dem Text einen Schatteneffekt hinzuzufügen. Über dieses Attribut können wir die Position, den Unschärfeabstand und die Farbe des horizontalen oder vertikalen Schattens festlegen.
CSS3-Textschatteneigenschaft
Funktion: Schatten auf Text anwenden.
Beschreibung: Festlegen oder Abrufen, ob der Text im Objekt Schatten- und Unschärfeeffekte aufweist.
Syntax:
text-shadow: h-shadow v-shadow blur color;
h-shadow: Die Position des horizontalen Schattens. Negative Werte sind erlaubt.
V-Schatten: Die Position des vertikalen Schattens. Negative Werte sind erlaubt.
Unschärfe: Unscharfer Abstand, kann weggelassen werden.
Farbe: Die Farbe des Schattens, kann weggelassen werden.
Beschreibung: Die Eigenschaft text-shadow fügt dem Text einen oder mehrere Schatten hinzu. Bei dieser Eigenschaft handelt es sich um eine durch Kommas getrennte Liste von Farbtönen, wobei jeder Farbton mit zwei oder drei Längenwerten und einem optionalen Farbwert angegeben wird. Die weggelassene Länge ist 0.
Verwendungsbeispiel des CSS3-Textschattenattributs
<!DOCTYPE html>
<html>
<head>
<style>
h1
{
text-shadow: 5px 5px 5px #FF0000;
}
</style>
</head>
<body>
<h1>文本阴影效果！</h1>
</body>
</html>Rendering:
Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er wird für das Studium aller hilfreich sein. Weitere spannende Inhalte finden Sie in den entsprechenden Tutorial-Kolumnen auf der chinesischen PHP-Website! ! !
Das obige ist der detaillierte Inhalt vonSo verwenden Sie das Textschatten-Attribut. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
CSS3-Tutorial
Was sind die CSS3-Gradienteneigenschaften?
Tastenkombination zum schnellen Herunterfahren
Was ist der Unterschied zwischen MySQL und MSSQL?
Wie erscheinen PR-Untertitel Wort für Wort?
Lösung für fehlgeschlagenes WIN10-Update
Kosteneffizienzanalyse des Lernens von Python, Java und C++
Was ist das Funktionsprinzip und der Prozess von Mybatis?
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
