So ändern Sie die Textransparenz in HTML/CSS?
CSS bietet Methoden, um Webseiten zu stylen. Es bietet viele Styling -Eigenschaften, über die Benutzer verschiedene Effekte in der Frontend -Entwicklung anwenden können, und Transparenz ist eines davon. Dadurch können Benutzer festlegen, wie transparent die Elemente auf ihren Webseiten angezeigt werden. Benutzer können auch die Transparenz des Hintergrunds, des Bildes, des Textes oder eines anderen Elements festlegen, indem die CSS verwendet werdenOpazität" Eigentum.
In diesem Beitrag wird die Methode zur Änderung der Texttransparenz in HTML und CSS demonstriert.
So ändern Sie die Textransparenz in HTML/CSS?
Um die Texttransparenz einer HTML -Seite mit CSS zu ändern, probieren Sie die angegebene Prozedur aus.
Schritt 1: Erstellen Sie einen Container
Erstellen Sie zuerst eine “divContainer mit Hilfe der “" Schild. Dann einfügen eine “Klasse”Mit einem bestimmten Namen.
Schritt 2: Absatz -Tag hinzufügen
Als nächstes fügen Sie "hinzu"”Tag, um Text in die Form eines Absatzes einzubetten und ihm eine zuweisen“Ausweis”Attribut:
Text mit 50% Transparenz
Text mit 100% Transparenz
Es ist zu bemerken, dass der Text erfolgreich hinzugefügt wurde:
Schritt 3: Bild hinzufügen
Greifen Sie im CSS -Abschnitt zunächst auf die “zu“Element mit dem Tag -Namen und wenden Sie die folgenden CSS -Eigenschaften an:
KörperHintergrundbild: URL (Hintergrund.png);
Hintergrundrepeat: No-Repeat;
Hier:
- “HintergrundbildDie Eigenschaft wird verwendet, um das Hintergrundbild mit Hilfe des "festzulegen"URL ()”. Geben Sie in den Klammern die Quelle oder URL des Bildes an.
- “Hintergrund WiederholungIst eine Eigenschaft, mit der das Bild wiederholt wird. Zum Beispiel haben wir die "festgelegt"Hintergrund Wiederholung" als "No-Repeat”.
Schritt 4: Stil „Div“ Element
Jetzt greifen Sie auf beide zu “div"Elemente mit dem".Transparenz"Klasse, dann zugreifen" .Transparenz P Im obigen Code: Ausgang Schritt 5: Stil zuerst " " Element Greife auf ... zu "”Element mit dem“para-1" Ausweis. Zu diesem Zweck haben wir das verwendet “#Selektor, um auf eine spezifische ID zuzugreifen und die genannten Eigenschaften anzuwenden: Die Beschreibung des obigen Codes lautet wie folgt: Ausgang Schritt 6: Stil Sekunde “ " Element Dann greifen Sie auf die “zu""Element mit ID"#Para-2”, Und wenden Sie die gleichen Eigenschaften an: Ausgang Es kann beobachtet werden, dass wir die Texttransparenz in HTML mit CSS geändert haben. Abschluss Um die Texttransparenz des Elements zu ändern, erstellen Sie zunächst die Elemente wie “wie“”. Weisen Sie ihm ein ID -Attribut zu, um in CSS darauf zuzugreifen. Danach nutzen Sie die “#"Selektor zusammen mit dem"Ausweis”Um durch ID auf das Element zugreifen zu können. Wende an "TextschattenEigentum zusammen mit dem “RGBA" Wert. Zuletzt die “Mix-Blend-ModusEigenschaft wird verwendet, um die Farbe mit dem übergeordneten Hintergrund zu mischen. Dieser Beitrag hat das Verfahren zur Änderung der Texttransparenz in HTML mit CSS erläutert.
Schriftgröße: 40px;
Schriftfamilie: Arial, Sans-Serif;
Buchstabenabteilung: 5px;
Schriftdicke: fett;
Text-Shadow: 0 5px 10px RGBA (0, 0, 0, 0.5);
Farbe: #fff;
Mix-Blend-Mode: Overlay;
Text-Shadow: 0 5px 10px RGBA (0, 0, 0, 0.5);
Farbe: #fff;
Mix-Blend-Mode: Overlay;