Da verschiedene Browser unterschiedliche Interpretationen von Tags und Stilblättern haben, müssen ein Standard -Dokumenttyp für die HTML -Datei definiert werden, sodass verschiedene Browser Seiten nach einem einheitlichen HTML -Standard analysieren und rendern können.
! DocType erklärt die DTD, die das angegebene Dokument entspricht, wie beispielsweise:
<! DocType html public -// w3c // dtd html 4.0 transitional // en http://www.w3.org/tr/html4/loose.dtd>
<! DocType html public -// w3c // dtd xhtml 1.0 transitional // en http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd>
Versuchen Sie bei der korrekten Verwendung von Standard -HTML -Tags das Div+CSS -Layout und verwenden Sie kein Tabellenlayout.
Die Verwendung von Tabellen für das Layout kann leicht eine Code -Redundanz verursachen. Im Vergleich zum Schreiben von <Div> </div> gibt es viele Codes. Darüber hinaus muss die Tabelle alle Elemente herunterladen und angezeigt, und die entsprechende Webseite ist auch langsam zu öffnen.
Es sollte eine standardisierte Seitenstruktur verwendet werden: Div+CSS. Diese Layout -Methode ist in Code, schneller Seiten -Browsergeschwindigkeit und flexibles Seitenlayout einfach. Bei der Überarbeitung müssen Sie nur den CSS -Stil ändern, um das Seitenrelais zu realisieren, ohne das Programm zu ändern, wodurch die Kosten für die Überarbeitung der Website gesenkt werden.
Achten Sie auf die schließende Beziehung des Tags, insbesondere wenn Sie andere Tags wie DIVs in Form -Tags nisten.Manchmal gibt es auf der Seite zusätzliche Lücken, die nicht vermieden werden können, selbst wenn der Rand zurückgesetzt wird. Zu diesem Zeitpunkt kann es sein, dass das Seitenelement -Etikett geschlossen ist und es keine Paarung gibt, wie z.
<div class = äußere>
<Formular name = testform>
<div class = inner>
<Eingabename = Titeltyp = Text />
</form>
</div>
</div>
Verwenden Sie das TBODY -Element beim Definieren von Tabellen, um sicherzustellen, dass alle Browser einschließlich des IE korrekt verwendet werden könnenSelbst wenn die Tabelle nicht das definierte TBODY -Element anzeigt, wird der Browser der Ansicht, dass der übergeordnete Knoten des TR -Knotens ein automatisch hinzugefügter Standard -TBODY -Knoten ist. Um die möglichen Missverständnisse bei der Manipulation des TR -Knotens mit JavaScript zu vermeiden, ist es besser, einen manuell hinzuzufügen, z. B.:
<table id = mytable>
<tbody id = mytableBody>
<tr>
<td>
</td>
</tr>
</tbody>
</table>
Achten Sie auf den Fall von Etiketten und AttributenManchmal reagieren einige Ereignisse mit Elementen im IE -Browser, jedoch nicht in Safari oder anderen Browsern. Zu diesem Zeitpunkt müssen Sie die Richtigkeit der Ereignisbindungsmethode überprüfen. Die Bindung fortschrittlicher Ereignisse muss sich von IE und anderen Browsern unterscheiden, um zwei Sätze von JavaScripts zu schreiben, während ein einfaches Ereignismodell auf den Fall des Bindungsereignamens achten muss. wie:
<Eingabe type = text name = keywordsearch onfocus = clearValue ()>
Der Kleinbuchstaben -Onfokus sollte hier verwendet werden, und die Standard -Schreibmethode ist das angezeigte Symbol für das hinzugefügte Tag -Verschluss.
<Eingabe type = text name = keywordsearch onfocus = clearValue () />
Achten Sie auf die Immobilienwerteinstellung des EtikettsDie Sprach- und Typeigenschaften des <script> -Tags
Das Sprachattribut des <Script> -Tags wird verwendet, um die Skriptsprachversion zu definieren. Die korrekte Zuordnung sollte wie <Script> sein, um dem Browser (hauptsächlich IE) mitzuteilen, dass sie die JavaScript -Syntax von Version 1.2 zur Erklärung verwenden soll. Das Typ -Attribut wird verwendet, um den Skriptyp zu definieren. Es handelt sich um ein Standardattribut von W3C, und die Verwendung von Attributen von Kleinbuchstaben ist eine Standardpraxis in Übereinstimmung mit den Standards. Wenn Sie dem Browser nicht mitteilen müssen, dass er es in der unteren Version der JavaScript -Sprache erklären soll (die aktuelle JavaScript -Version, die von den meisten Browsern unterstützt wird, ist 1.5), müssen Sie das Sprachattribut im Allgemeinen nicht definieren, das Typattribut muss jedoch definiert werden. Der Code sollte also sein
<Script Language = JavaScript> Änderung in <Script> Die Alt- und Titelattribute des <a> TagsObwohl die Werte der beiden Attribute ALT und Titel in Form von Werkzeugspitzen angezeigt werden, wenn die Maus im IE schwebt, gibt es immer noch einen Unterschied zwischen den beiden. ALT ist die alternative Anzeige, wenn das Bild nicht angezeigt wird, und der Titel ist die Eingabeaufforderung, wenn die Maus darauf platziert ist.
Überprüfte und readonly Eigenschaften von <eingabe> TagIn früheren Versionen von HTML war es nicht obligatorisch, dass allen Attributen Werte zugewiesen werden sollten. Bei der Darstellung eines Kontrollkästchens wird die Schreibmethode von <Eingabe geprüft> erkannt. Nach dem XHTML -Standard ist eine solche Grammatik jedoch kein strenger XML -Format. Achten Sie auf die Zuordnung von Attributen und die Schließung von Tags, um sich dem Entwicklungstrend der HTML -Standards anzupassen. Es ist wie folgt geschrieben:
<Eingabe checked = checked /> <Eingabe readonly = readonly /> Die Select ED -Eigenschaft des <option> -Tags auswählenAus dem gleichen Grund wie im vorherigen Artikel sollte der ausgewählten Eigenschaft des <option> -Tags in der Option <Select> auch ein Wert zugewiesen werden:
<Option ausgewählt = ausgewählt />
Das align = absmiddle -Attribut des <img> -TagGemäß dem XHTML -Standard sollten sich HTML -Tags eher auf die Inhaltsdarstellung als auf die Style -Steuerung konzentrieren, und die Stile sollten CSS zur Anpassung überlassen werden. Daher wurden einige alte Tags und Attribute verworfen, z. B. <em> Tags und <i> Tags, die die chinesischen Zeichen kursiv in Kursivschrift erscheinen lassen, aber <i> Tags, die einfach nach Stil benannt sind, sind bereits ein verlassener Standard und werden durch <em> Tags ersetzt, die die Bedeutung des Schwerpunkts darstellen. In ähnlicher Weise zeigt das Ausstell = Absmiddle -Attribut des <img> Tag an, dass das Bild vertikal zentriert und mit benachbartem Text ausgerichtet ist. Dies ist auch ein Attribut, das Stil darstellt. CSS sollte anstelle dieses Attributs verwendet werden, um den Ausrichtungsstil des Bildes zu kontrollieren, um den gegenseitigen Einfluss der beiden Stilsteuerungen zu vermeiden.
Die Framebordereigenschaft des <Iframe> -TagsBei Verwendung eines Iframe dürfen Sie den Rand des Iframe nicht durch Einstellen von Border = 0 in IE anzeigen, aber das Standard -Randattribut für Steuerrahmen ist FrameBorder. Sie sollten Framborder = 0 festlegen, um den Rand des Rahmens in anderen Browsern außerhalb des IE zu verbergen:
<iframe Framborder = 0 />
Die Cellpadding -Eigenschaft des <table> -TagsDieses Attribut ist wie das Align -Attribut des <Mg> -Tags ebenfalls ein Attribut, das die Verantwortung von HTML zur Darstellung von Inhalten und Steuerelementstilen überwindet. Es gibt den Raum zwischen Einheiten an. Aus praktischer Sicht ist es am besten, Cellpadding nicht anzugeben, sondern CSS zu verwenden, um die inneren Ränder von Zellen zu kontrollieren.
Das Nowrap -Attribut des <td> TagsNowrap ist ein Attribut, das angibt, dass der Inhalt nicht automatisch umrundet, aber wie das obige Attribut ist dies ein Attribut, das den Stil steuert. In HTML 4.01 werden BGColor, Höhe, Breite und Nowrap des <td> -Tags nicht bevorzugt. In XHTML 1.0 werden die BGColor, die Höhe, die Breite und das Nowrap des <td> -Tags nicht unterstützt.