Einige CSS/XHTML-Wissenszusammenfassungen zum Erlernen von WEB-Standards Seite 1/3_Erfahrungsaustausch

1. Viele Kompatibilitätsprobleme werden dadurch verursacht, dass verschiedene Tags in verschiedenen Browsern unterschiedliche Standardwerte für den Füllrand haben. So können Sie im Voraus definieren

Code kopieren Der Code lautet wie folgt:

* { padding: 0; Rand: 0;}

oder

Code kopieren Der Code lautet wie folgt:

ul, li,h1,h2,h3,h4,h5,h6,p,table,td,p,img,hr,dd,dt,span,a,dt,dd,ol{margin: 0;padding:0;font- size:12px;}

2. Was das Layout betrifft, können Sie sehen, wie die Vorlage in Dreamweaver CS3 geschrieben ist Die Schreibmethode ist die beste. Für große Layouts können Sie direkt die Standardvorlagen in Dreamweaver CS3 verwenden. Dann entfernen Sie den Kommentar und es wird funktionieren.

3. Beim Anpassen der Position von Elementen im Feld ist es besser, den Abstand des Feldes zu verwenden. Verwenden Sie nicht den Rand des Elements innerhalb der Box.

Der Grund dafür ist, dass, wenn die Elemente in der Box einen Rand verwenden, dies Auswirkungen auf den Rand der Box hat und zu einer Fehlausrichtung führt.

Aber achten Sie bei der Verwendung von Padding auf eines: Wenn beispielsweise das ursprüngliche Feld width:100px auf padding-left:20px eingestellt ist, dann muss die Breite um 20px subtrahiert werden.

4. Bei einem Feld müssen Sie nach dem Festlegen des Randes die Breite des Randes von der Breite abziehen. Wenn beispielsweise eine Box mit der Breite 100 Pixel links und rechts 1 Pixel Seiten hat, sollte die Boxbreite auf 98 Pixel eingestellt werden.

5. Versuchen Sie beim Hinzufügen einer Box, möglichst keine Breite und Höhe anzugeben.

Höhe durch Innenelemente erweiterbar.

Wenn die Breite nicht festgelegt ist, ist der Standardwert 100 % Breite.

6. Die Möglichkeit, das Hintergrundbild und die Hintergrundfarbe für ein Feld gleichzeitig festzulegen, besteht darin, zuerst das Hintergrundbild und dann die Hintergrundfarbe festzulegen. Der Code lautet wie folgt:

Kopieren Sie den Code Der Code lautet wie folgt:

.bg {background:url(/images/blbian.gif) no -repeat}
.style1 {width:100px;height: 100px;background-color:#ebf1e5;}

7. Wenn auch Dinge wie float:left geschrieben werden: Wenn es umgebende oder darunter liegende Elemente betrifft, versuchen Sie es mit clear:both zu löschen.

Code kopieren Der Code lautet wie folgt:

.clearfloat {
clear:both;
font-size: 1px;
}

8. Beim Vornehmen der folgenden Einstellungen

treten Kompatibilitätsprobleme auf. Es wird ein Problem mit ie6 geben. Sie werden feststellen, dass die Box nicht 3 Pixel hoch ist.
Die folgenden Einstellungen sind erforderlich: Schriftgröße:1px; es wird also kein Problem geben. Beziehen Sie sich auf die Schreibmethode in Clearfloat in der dw cs3-Vorlage und fügen Sie auch line-height: 0px hinzu. Aber ich habe festgestellt, dass es möglich ist, es nicht hinzuzufügen. Aber die Canadian Association ist formeller.

9. Wenn Sie die Höhe für eine einzelne Textzeile festlegen, legen Sie gleichzeitig die Zeilenhöhe fest. Andernfalls kommt es zu Kompatibilitätsproblemen und der Text wird leicht falsch ausgerichtet.

10. Stellen Sie bei Verwendung von ul li list sicher, dass list-style-type: none festgelegt ist. Andernfalls treten Kompatibilitätsprobleme auf. Der Ursprung erscheint unter ff, ist aber unter ie oft nicht sichtbar.