Heim Web-Frontend CSS-Tutorial Beim Parsen unterstützen IE-, Firefox- und Opera-Browser die Alpha-Transparenzmethode

Beim Parsen unterstützen IE-, Firefox- und Opera-Browser die Alpha-Transparenzmethode

May 16, 2016 pm 12:09 PM
firefox opera

In diesem Kapitel wird analysiert, wie IE-, Firefox- und Opera-Browser Alpha-Transparenz unterstützen. Freunde in Not können sich darauf beziehen.

Bitte schauen Sie sich zuerst den folgenden Code an:

Der Code lautet wie folgt:

1

2

3

filter:alpha(opacity=50);       /* IE */ 

-moz-opacity:0.5;              /* Moz + FF */ 

opacity: 0.5;           /* 支持CSS3的浏览器(FF 1.5也支持)*/

Nach dem Login kopieren

Einfache Erklärung, IE verwendet die privates Attribut filter:alpha( opacity), Moz Family verwendet das private Attribut -moz-opacity und das Standardattribut ist opacity (CSS 3, Moz Family unterstützt teilweise CSS3). Der folgende Wert ist Transparenz. Verwenden Sie einen Prozentsatz oder eine Dezimalzahl (Alpha (Deckkraft). Verwenden Sie einen Wert größer als 0 und kleiner als 100, was eigentlich ein Prozentsatz ist).

Opera wird im obigen Code nicht angezeigt. Richtig, Opera unterstützt noch keine Standard-Deckkraft und verfügt auch nicht über eigene private Eigenschaften zur Unterstützung der Alpha-Transparenz.

Wir wissen jedoch, dass Opera Alpha-transparente PNG-Bilder unterstützt (natürlich unterstützt auch Moz Family dies). Wir können also ein Hintergrundbild verwenden, um Alpha-Transparenz zu erreichen.

Beispiel: http://realazy.org/lab/alpha/

Der Schlüssel ist:

Der Code lautet wie folgt:

1

2

3

background: transparent url(alpha80.png) left top repeat!important; 

background: #ccc; 

filter:alpha(opacity=50);

Nach dem Login kopieren

Da die Moz-Familie Alpha-transparentes PNG unterstützt, besteht für uns keine Notwendigkeit, ihre privaten Eigenschaften zu verwenden. Natürlich können Sie die Standard-Deckkraft verwenden, aber verwenden Sie nicht gleichzeitig ein Alpha-transparentes Bild und eine Deckkraft, da sonst eine Mischung aus beiden entsteht. Sie können das obige Beispiel herunterladen und sich die Kommentare von /*opacity: .5;*/ ansehen.

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 Artikel -Tags

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 entferne ich Firefox Snap unter Ubuntu Linux? Wie entferne ich Firefox Snap unter Ubuntu Linux? Feb 21, 2024 pm 07:00 PM

Wie entferne ich Firefox Snap unter Ubuntu Linux?

Kann Mozilla Firefox deinstalliert werden? Kann Mozilla Firefox deinstalliert werden? Mar 15, 2023 pm 04:40 PM

Kann Mozilla Firefox deinstalliert werden?

Neue Funktionen von Firefox 113: Unterstützung für AV1-Animationen, verbesserter Passwortgenerator und Bild-in-Bild-Funktionen Neue Funktionen von Firefox 113: Unterstützung für AV1-Animationen, verbesserter Passwortgenerator und Bild-in-Bild-Funktionen Mar 05, 2024 pm 05:20 PM

Neue Funktionen von Firefox 113: Unterstützung für AV1-Animationen, verbesserter Passwortgenerator und Bild-in-Bild-Funktionen

Wie kann ich Mozilla Firefox in Scrapy verwenden, um das Problem des Scannens des QR-Codes zum Anmelden zu lösen? Wie kann ich Mozilla Firefox in Scrapy verwenden, um das Problem des Scannens des QR-Codes zum Anmelden zu lösen? Jun 22, 2023 pm 09:50 PM

Wie kann ich Mozilla Firefox in Scrapy verwenden, um das Problem des Scannens des QR-Codes zum Anmelden zu lösen?

Kunlun Wanwei bringt den weltweit ersten Mainstream-Browser auf den Markt, der große End-Side-KI-Modelle integriert Kunlun Wanwei bringt den weltweit ersten Mainstream-Browser auf den Markt, der große End-Side-KI-Modelle integriert Jun 09, 2024 pm 05:48 PM

Kunlun Wanwei bringt den weltweit ersten Mainstream-Browser auf den Markt, der große End-Side-KI-Modelle integriert

Firefox-Browser Firefox 115 veröffentlicht, unterstützt die letzte Version von Win7/Win8.1 Firefox-Browser Firefox 115 veröffentlicht, unterstützt die letzte Version von Win7/Win8.1 Mar 04, 2024 pm 04:46 PM

Firefox-Browser Firefox 115 veröffentlicht, unterstützt die letzte Version von Win7/Win8.1

Ubuntu 23.10 führt Firefox standardmäßig im nativen Wayland-Modus aus Ubuntu 23.10 führt Firefox standardmäßig im nativen Wayland-Modus aus Feb 29, 2024 am 10:10 AM

Ubuntu 23.10 führt Firefox standardmäßig im nativen Wayland-Modus aus

Firefox 115 Beta veröffentlicht: Einführung von Schnellaktionen Firefox 115 Beta veröffentlicht: Einführung von Schnellaktionen Mar 04, 2024 pm 03:10 PM

Firefox 115 Beta veröffentlicht: Einführung von Schnellaktionen

See all articles