Ich glaube , diese Frage wurde von vielen Leuten im Internet gestellt und ich möchte mein persönliches Verständnis in zwei Punkten festhalten: Erstens , die theoretische Leistung Der zweite Unterschied ist der Unterschied in der Browserkompatibilität.
Leistungsunterschiede:
[border:0;] Obwohl die für den Rahmen auf „0“ gesetzten Pixel auf der Seite nicht sichtbar sind, rendert der Browser gemäß dem Standardwert des Rahmens dennoch die Rahmenbreite/Rahmenfarbe, also die Der Speicherwert ist belegt.
[border:none;] Setzen Sie den Rand auf „none“, was bedeutet, dass es keinen Rand gibt. Wenn der Browser „none“ analysiert, führt er keine Rendering-Aktionen aus, das heißt, er verbraucht keine Speicherwerte.
Kompatibilitätsunterschiede:
Der Kompatibilitätsunterschied gilt nur für die Browser IE6, IE7 und Beschriftungstasten und -eingaben. Diese Situation tritt unter dem XP-Design von Win, Win7 und Vista auf.
[border:none;] Wenn border „none“ ist, scheint der ungültige Rahmen für IE6/7 immer noch vorhanden zu sein, wie im folgenden Beispiel Demo1 gezeigt:
[border:0;] Wenn border „0“ ist, fühlt es sich effektiver an als „none“. Alle Browser blenden den Rand einheitlich aus, wie im folgenden Beispiel Demo2 gezeigt:
Zusammenfassen :
Beim Vergleich von border:0; und border:none; liegt der Unterschied im Rendering und no Rendering. Es gibt jedoch keinen Test für den Rendering-Leistungsvergleich Obwohl davon ausgegangen wird, dass es einen Unterschied in der Rendering-Leistung gibt, kann dies nur als theoretisch bezeichnet werden.
Wie mache ich border:none; vollständig kompatibel? Fügen Sie einfach das Hintergrundattribut demselben Selektor hinzu, wie im folgenden Beispiel Demo3 gezeigt:
Bezüglich border:0; und border:none; bevorzuge ich persönlich die Verwendung von border:none;, da border:none; hinsichtlich des Leistungsverbrauchs doch nicht umstritten ist und die Kompatibilität mit Hintergrundattributen gelöst werden kann und kein Hindernis darstellt .