Résumé de l'expérience de développement multi-navigateurs (1) HTML markup_HTML/Xhtml

Résumé de l'expérience de développement multi-navigateurs (1) HTML markup_HTML/Xhtml_webpage production

WBOY

Libérer： 2016-05-16 16:41:58

original

1342 Les gens l'ont consulté

为页面添加DOCTYPE
由于不同浏览器对标签,样式表的解释不尽相同,所以需要为html文件定义一个标准的文档类型,使不同浏览器尽量按照一个统一的html标准来解析渲染页面。

!DOCTYPE 声明指定文档遵从的 DTD，如：

标准HTML标签的正确使用
尽量使用div+css布局,不用table做布局。
使用table做布局容易造成代码冗余，相对

编写来说，代码繁多。并且，table需要将元素都下载后进行显示，相应的网页打开速度也较慢。

应该使用标准化的页面结构：DIV+CSS。这种布局方式代码简洁，页面浏览速度较快，页面布局灵活，改版时只需改CSS样式即可实现页面重新布局，而不用改动程序，从而降低了网站改版的成本。

注意标签的闭合关系,尤其是在form标签中嵌套div等其他标签时。
有的时候页面上会出现多余的空白，即使重新设置了margin也无法避免，这个时候有可能是页面元素标签闭合出现了不配对的情况，如：

Utilisez l'élément tbody lors de la définition du tableau pour garantir que tous les navigateurs, y compris IE, peuvent l'utiliser correctement
Même si le tableau n'affiche pas l'élément tbody défini, l'élément le navigateur le considérera tr Le nœud parent du nœud est un nœud tbody par défaut ajouté automatiquement. Afin d'éviter d'éventuels malentendus lors de l'utilisation de javascript pour manipuler le nœud tr, il est préférable d'en ajouter un manuellement, tel que :

;/tr>

Faites attention à la capitalisation des balises et des attributs

Parfois, certains événements sont liés les éléments répondent dans les navigateurs IE, mais ils ne répondent pas dans Safari ou d'autres navigateurs. À ce stade, vous devez vérifier l'exactitude de la méthode de liaison d'événement. Pour la liaison d'événement avancée, vous devez écrire deux ensembles de javascript pour distinguer IE des autres navigateurs. Pour les modèles d'événements simples, vous devez faire attention au cas. du nom de l'événement lié. Par exemple :

Vous devez utiliser onfocus en minuscule ici et ajouter le symbole de fermeture de l'étiquette. affiché Il s'agit de la manière standard d'écrire.

Faites attention à la valeur de l'attribut réglage de l'étiquette

Les attributs de langue et de type de la balise

Derniers articles par auteur