Erläuterung des Hintergrunds:transparent in CSS

Dieser Artikel stellt hauptsächlich die Erklärung zum Hintergrund vor: Transparent in CSS. Jetzt kann ich ihn mit Ihnen teilen.

Was genau ist transparent in CSS? Bedeutet das? Ich habe es immer für seltsam gehalten. Dieser Artikel wird es im Detail erklären.

Manchmal sehe ich das Einige CSS-Attribute sind als „background:transparent“ definiert. Das bedeutet, dass der Hintergrund transparent ist. Tatsächlich ist die Standardfarbe des Hintergrunds das transparente Attribut. Es ist also das Gleiche, ob Sie schreiben oder nicht.
Ich habe seit einiger Zeit keinen Computer mehr bei mir Beim Schreiben einer Webversion des Betriebssystems bin ich sicher auf viele Probleme gestoßen, die jedoch sehr problematisch waren Ich arbeite hart daran, sie zu lösen. Lassen Sie mich nun über ein Problem sprechen, auf das ich kürzlich gestoßen bin Im Stil dieses p ist transparent. Haha, wenn ich eine Maske aus p mache, dann schau dir bitte den folgenden Code an:

p.style.position="absolute"; 
p.style.width=document.body.clientWidth+"px"; 
p.style.height=document.body.clientHeight+"px"; 
p.style.left="0px"; 
p.style.top="0px"; 
p.style.zIndex="2000"; 
p.style.backgroundColor="black"; 
p.style.filter="alpha(opacity="+0+");";

Wir betrachten hauptsächlich die letzten beiden Codezeilen. Wie bereits erwähnt, ist das Attribut „Hintergrundfarbe“ transparent, also warum müssen wir zu gehen die Mühe, ein Schwarz festzulegen (es spielt keine Rolle, legen Sie einfach eine Farbe fest, solange diese nicht transparent ist und keine leere Zeichenfolge sein darf. Der Browser verwendet standardmäßig eine leere Zeichenfolge (sie wird als transparent angezeigt) und legt fest
Ich habe das Experiment zunächst selbst durchgeführt, aber nachdem ich mich beruhigt und darüber nachgedacht hatte, entdeckte ich den Unterschied In den letzten beiden Sätzen des Codes können wir die maskierten Elemente bearbeiten, was bedeutet, dass sie keinen Abschirmungseffekt haben. Diese Operation ist jedoch begrenzt. Insbesondere können wir nur die fokussierten Elemente bearbeiten, z. B. Text und Bilder , Schaltflächen usw., lassen Sie mich Ihnen ein Beispiel geben:

<p style="border:1px red solid;width:100px;height:100px" onclick="alert(1)">123</p>

Sagen wir es so, jeder versteht es. Aus diesem Grund sind die letzten beiden Sätze erforderlich. Nur auf diese Weise können wir den Stil auf „Vollständig abgeschirmte Farbe“ setzen 🎜>, dann muss der folgende Text möglicherweise den Hintergrund löschen und

background:inherit;

Vier Zustände im CSS-Stil eines Tags

CSS Einführung in die Verwendung des Solid-Attributs von Border

Das obige ist der detaillierte Inhalt vonErläuterung des Hintergrunds:transparent in CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!