Heim Web-Frontend CSS-Tutorial CSS3-Tutorial (9): Einstellen der RGB-Farbe_css3_CSS_Webseitenproduktion

CSS3-Tutorial (9): Einstellen der RGB-Farbe_css3_CSS_Webseitenproduktion

Dec 23, 2016 pm 04:08 PM
css3

Webseitenproduktion Webjx-Artikeleinführung: Mit der neuen CSS3-Anweisung „RGBA“ können wir nicht nur wie gewohnt die RGB-Farbe festlegen, sondern auch deren Transparenz festlegen. Mithilfe der neuen CSS3-Deklaration „RGBA“ können wir nicht nur wie gewohnt die RGB-Farbe festlegen, sondern auch deren Transparenz festlegen.


Mit der neuen CSS3-Deklaration „RGBA“ können wir nicht nur wie gewohnt die RGB-Farbe festlegen, sondern auch deren Transparenz festlegen.
Mit der neuen CSS3-Deklaration „RGBA“ können wir nicht nur wie gewohnt die RGB-Farbe festlegen, sondern auch deren Transparenz festlegen.
Vorheriger Artikel: CSS3-Tutorial (8): CSS3-Transparenzleitfaden
RGBA legt die Farbe genau wie RGB fest, und dieses „A“ – der letzte Wert in RGBA – ermöglicht es uns, die Transparenz dieses Elements festzulegen. Genau wie bei der Opazitätsdeklaration ist ein Element mit einem Opazitätswert von 1 vollständig undurchsichtig, während ein Element mit einem Opazitätswert von 0 vollständig transparent ist.
Browserkompatibilität
RGBA wird jetzt in Firefox, Google Chrome und Safari gut unterstützt und erfordert auch kein Präfix. CSS3 RGBA-Farbe

CSS3-Tutorial (9): Einstellen der RGB-Farbe_css3_CSS_Webseitenproduktion

Der obige Effekt wird mit den folgenden Stilen erreicht:
div.rgbaL1 { background:rgba(153, 134, 117, 0.2); 20px; } div.rgbaL2 { Hintergrund:rgba(153, 134, 117, 0,4); } div.rgbaL3 { Hintergrund:rgba(153, 134, 117, 0,6); { Hintergrund: rgba (153, 134, 117, 0,8); Höhe: 20 Pixel; 🎜 >Firefox(3.05…)

Google Chrome(1.0.154…)

Google Chrome(2.0.156…)

Internet Explorer(IE7, IE8 RC1)

Opera(9.6…)

Safari(3.2.1 Windows…)

Das Obige ist der Inhalt des CSS3-Tutorials (9): Einstellen der RGB-Farbe_css3_CSS_webseitenproduktion, mehr Für Verwandte Inhalte, achten Sie bitte auf die chinesische PHP-Website (www.php.cn)!


Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Beste grafische Einstellungen
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. So reparieren Sie Audio, wenn Sie niemanden hören können
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Wie man alles in Myrise freischaltet
4 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Wie erzielt man mit reinem CSS3 einen Welleneffekt? (Codebeispiel) Wie erzielt man mit reinem CSS3 einen Welleneffekt? (Codebeispiel) Jun 28, 2022 pm 01:39 PM

Wie erzielt man mit reinem CSS3 einen Welleneffekt? In diesem Artikel erfahren Sie, wie Sie mit SVG- und CSS-Animationen Welleneffekte erstellen.

Verwenden Sie CSS geschickt, um verschiedene seltsam geformte Schaltflächen zu realisieren (mit Code). Verwenden Sie CSS geschickt, um verschiedene seltsam geformte Schaltflächen zu realisieren (mit Code). Jul 19, 2022 am 11:28 AM

Dieser Artikel zeigt Ihnen, wie Sie mithilfe von CSS auf einfache Weise verschiedene seltsam geformte Schaltflächen realisieren können, die häufig vorkommen. Ich hoffe, dass er Ihnen hilfreich sein wird!

So verstecken Sie Elemente in CSS, ohne Platz zu beanspruchen So verstecken Sie Elemente in CSS, ohne Platz zu beanspruchen Jun 01, 2022 pm 07:15 PM

Zwei Methoden: 1. Fügen Sie mit dem Anzeigeattribut einfach den Stil „display:none;“ zum Element hinzu. 2. Verwenden Sie die Attribute „position“ und „top“, um die absolute Positionierung des Elements festzulegen, um das Element auszublenden. Fügen Sie dem Element einfach den Stil „position:absolute;top:-9999px;“ hinzu.

So implementieren Sie Spitzenränder in CSS3 So implementieren Sie Spitzenränder in CSS3 Sep 16, 2022 pm 07:11 PM

In CSS können Sie das Attribut „border-image“ verwenden, um einen Spitzenrand zu erzielen. Das Attribut „border-image“ kann Bilder zum Erstellen von Rändern verwenden, d. h. zum Hinzufügen eines Hintergrundbilds zum Rand. Sie müssen lediglich das Hintergrundbild als Spitzenstil angeben Bildrandbreite nach innen. Ob der Anfang wiederholt wird;".

Es zeigt sich, dass Textkarussell und Bildkarussell auch mit reinem CSS realisierbar sind! Es zeigt sich, dass Textkarussell und Bildkarussell auch mit reinem CSS realisierbar sind! Jun 10, 2022 pm 01:00 PM

Wie erstelle ich ein Textkarussell und ein Bildkarussell? Das erste, woran jeder denkt, ist die Verwendung von js. Tatsächlich können Textkarussell und Bildkarussell auch einen Blick auf die Implementierungsmethode werfen.

So vergrößern Sie das Bild durch Klicken mit der Maus in CSS3 So vergrößern Sie das Bild durch Klicken mit der Maus in CSS3 Apr 25, 2022 pm 04:52 PM

Implementierungsmethode: 1. Verwenden Sie den Selektor „:active“, um den Status des Mausklicks auf das Bild auszuwählen. 2. Verwenden Sie das Transformationsattribut und die Funktion „scale()“, um den Bildvergrößerungseffekt zu erzielen. Die Syntax „img:active {transform : Skala(x-Achsen-Vergrößerung, y-Achsen-Vergrößerung);}".

Hat der CSS3-Animationseffekt eine Verformung? Hat der CSS3-Animationseffekt eine Verformung? Apr 28, 2022 pm 02:20 PM

Der Animationseffekt in CSS3 verfügt über eine Verformung. Sie können „Animation: Animationsattribut @keyframes ..{..{transform: Transformationsattribut}}“ verwenden, um den Animationsstil festzulegen Das Transformationsattribut wird zum Festlegen des Verformungsstils verwendet.

So legen Sie die Rotationsgeschwindigkeit der Animation in CSS3 fest So legen Sie die Rotationsgeschwindigkeit der Animation in CSS3 fest Apr 28, 2022 pm 04:32 PM

In CSS3 können Sie das Attribut „animation-timing-function“ verwenden, um die Rotationsgeschwindigkeit der Animation festzulegen. Dieses Attribut wird verwendet, um anzugeben, wie die Animation einen Zyklus abschließt und die Geschwindigkeitskurve der Animation festlegt. Animation-Timing-Funktion: Geschwindigkeitsattributwert;}".

See all articles