Wie behebe ich gezackte Kanten in Firefox 3D-CSS-Transformationen?

3D-CSS-Transformation: Bewältigung gezackter Kanten in Firefox

Parallel zum Problem der gezackten Kanten bei Chrome-CSS-Transformationen tritt ein ähnliches Problem auf mit Firefox bei 3D-Transformationen. Eine Illustration finden Sie in diesem JSFiddle (Firefox-spezifisch): http://jsfiddle.net/78dK/5/.

Anders als in Chrome bietet die Sichtbarkeit der Rückseite in Firefox keine Lösung.

Problemumgehungen:

Problemumgehung 1 (Umrissattribut):

Für eine universellere Lösung sollten Sie das Hinzufügen eines transparenten Umrissattributs in Betracht ziehen:

<code class="css">outline: 1px solid transparent;</code>

Dieser Ansatz wurde auf Firefox 10.0.2 Windows 7 verifiziert: http://jsfiddle.net/nKhr8/.

Workaround 2 (Randattribut):

Alternativ können Sie ein Rahmenattribut mit einer zum Hintergrund passenden Farbe hinzufügen:

<code class="css">border: 1px solid white;</code>

Diese Option ist wirksam, wenn die Hintergrundfarbe bekannt ist (z. B. in diesem Fall Weiß). : http://jsfiddle.net/LPEfC/.

Das obige ist der detaillierte Inhalt vonWie behebe ich gezackte Kanten in Firefox 3D-CSS-Transformationen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!