So lösen Sie das Chrome-Randradius-Dilemma

Chromes Randradius-Dilemma gelöst

Obwohl alle erforderlichen Randradius-Präfixe angewendet wurden, trat bei den Lesern ein Problem auf, bei dem abgerundete Ecken fehlten #screen-Element in Chrome, während es in Firefox und IE9 optimal funktioniert.

Bei der Untersuchung wurde die Hypothese aufgestellt, dass Chromes Handhabung des Bildzuschneidens die Ursache war. Es wurde jedoch angenommen, dass dieses Problem nur direkt enthaltene -Dateien betrifft. Tags, keine über CSS definierten Hintergrundbilder.

Die Lösung für dieses verwirrende Problem ist eine einfache, aber effektive Problemumgehung:

<code class="css">.element-that-holds-pictures {
   perspective: 1px; /* any non-zero value will work */
}</code>

Diese Optimierung fügt dem Containerelement Perspektive hinzu und korrigiert so effektiv die Darstellung von Chrome Verhalten. Im Gegensatz zu anderen Problemumgehungen, wie z. B. dem Anpassen der Deckkraft, verändert diese Lösung weder das Erscheinungsbild noch die Funktionalität des Elements.

Durch die Implementierung dieser Problemumgehung können sich Leser jetzt auch in Chrome über die gewünschten abgerundeten Ecken für ihr #screen-Element freuen.

Das obige ist der detaillierte Inhalt vonSo lösen Sie das Chrome-Randradius-Dilemma. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!