请叫我一米 » 应该避免的十个常见的 html 结构错误

错误一：

行内元素和块级元素混用，例如：

<a href="#"><h2>This is wrong.</h2></a>
<h2><a href="#">This is right.</a></h2>

a 行内元素，hx 块级元素。

错误二：

img 元素未包括 alt 属性。

<img src="a.jpg" />  <!--Wrong-->
<img src="a.jpg" alt="this is a image" /> <!--Right-->

错误三：

正确的时候使用 lists 结构。例如：

<p>
    This<br />
    is<br />
    very<br />
    Wrong<br />
</p>
<ul>
    <li>This</li>
    <li>is</li>
    <li>very</li>
    <li>Right</li>
</ul>

错误四：

标签应该从语义触发，而非样式。例如：strong 更好

<b>This is bold.<b>
so<strong>is this, but this is better.</strong>

错误五：

最好用 css 而非结构控制，例如：

This is
<br />
<br />
Wrong.

错误六：

还是注意标签的语义化。例如：

<s>和<strike>已经被抛弃了。
<del>和<ins>才是新的可用的哦。

错误七：

使用内联样式，例如：

<h2 style="color:red;">This is Wrong.</h2>

错误八：

在 html 结构中使用已经被抛弃的属性，而应该使用 css 控制，例如：

<img src="a.jpg" alt="xxx" border="0" />

错误九：

没有正确使用 header 标签，例如：

<p><strong>This is header but wrong</strong></p>
<p>this is content.</p>

<h2>This is right header</h2>
<p>this is content.</p>

错误十：

不要使用非标准的和不推荐使用的标签，例如：

<blink>This is Wrong.</blink>
和
<marquee>This is Wrong.</marquee>

应该避免的十个常见的 html 结构错误