Einführung und Funktion von Hintergrund: transparent in CSS

Wenn Sie sich CSS ansehen, sehen Sie manchmal, dass einige CSS-Eigenschaften als „background:transparent“ definiert sind. Das bedeutet, dass der Hintergrund transparent ist. Tatsächlich ist die Standardfarbe des Hintergrunds das transparente Attribut.

Wenn beispielsweise ein Element ein anderes Element überdeckt und Sie das darunter liegende Element anzeigen möchten, müssen Sie den Hintergrund des darüber liegenden Elements auf transparent setzen.

Empfohlenes Handbuch:CSS-Online-Handbuch

Im Folgenden wird die Rolle des Hintergrunds vorgestellt:transparent in CSS

1. Einführung in den Hintergrund

Hintergrund ist ein Kurzattribut, das zum Festlegen aller Hintergrundattribute in einer Anweisung verwendet wird.

Mögliche Werte:

background-color
background-image
background-repeat
background-attachment
background-position

Beispielsweise stellt

background : transparent none repeat scroll 0% 0%

jeweils

Hintergrundattribute dar: Hintergrundfarbe, Hintergrundbild, ob der Hintergrund Wird wiederholt, ändert sich der Hintergrund jederzeit. Browser-Scroll-Hintergrund, flache Position, vertikale Hintergrundposition

background : background-color || background-image || background-repeat || background-attachment || background-position

Erklärung des obigen CSS

transparent   表示透明无颜色，是background-color 的默认值
none   表示没有设置背景图片
repeat   表示图片重复
scroll   表示背景图片随浏览器下拉而滚动
0%   水平位置在x0
0%   垂直位置在y0

Empfohlene verwandte Artikel:
1. Was bedeutet Hintergrund in CSS? Detaillierte Erläuterung der Hintergrundnutzung
2.Wie verwende ich das transparente Attribut, um Transparenz in CSS festzulegen? Zeichnen Sie verschiedene Dreiecke mit transparentem Attribut (Codebeispiel)
Verwandte Video-Tutorials:
1.CSS-Video-Tutorial – Jade Girl Heart Sutra Edition

2. Die Rolle von „background:transparent“ in CSS

Ereignisse von Elementen, deren Hintergrundfarbe transparent ist, werden von den davon abgedeckten Elementen abgefangen nicht fokussiert, dann wird das Ereignis zur Verarbeitung an das transparente Element ausgetauscht und entsprechend diesem Element gesprudelt. Andernfalls wird das Ereignis mit Fokus vom Objekt mit Fokus ohne Austausch verarbeitet und entsprechend dem fokussierten Element gesprudelt

1. Mit der folgenden Div-Maske kann diese Funktion Benutzer davon abhalten, andere Elemente auf der Webseite zu bedienen. Wenn das Suffix des obigen Codes nicht zwei Sätze enthält, können wir die maskierten Elemente bearbeiten, was bedeutet, dass dies keinen Abschirmungseffekt hat. Diese Operation ist jedoch begrenzt. Insbesondere können wir nur fokussierte Elemente wie Text bearbeiten . , Bilder, Schaltflächen usw.

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

2. Zum Beispiel das folgende DIV

Unter normalen Umständen wird eine Warnung ausgegeben, solange Sie irgendwo auf dieses Div klicken, aber wenn es von einem Element mit abgedeckt wird eine Hintergrundfarbe von transparent. Zu diesem Zeitpunkt erhalten wir die Warnung nur, wenn wir auf 123 klicken, da der Text den Fokus erhalten kann, und das Gleiche gilt für andere Elemente

Das obige ist der detaillierte Inhalt vonEinführung und Funktion von Hintergrund: transparent in CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!