IT民工的坐井观天

Author: Glen Stansberry

Glen Stansberry is a web developer and blogger. You can read more tips on web development at his blog Web Jackalope or follow him on Twitter.

1. <cite>

我想大家对于<blockquote>这个标签是非常熟悉的，比如上面的原作者信息这个内容就是一个<blockquote>。但是对于它的小兄弟<cite>标签可能大家就不是很熟悉了，<cite>标签用在对于书籍，文章的引用，默认显示为斜体，当然你可以通过css来控制实际的样式。

例：“若尘你也是堂堂七尺男儿，该有那十荡十诀之勇” 引用自 《尘缘》

2. <optGroup>

这个其实挺有用处的，对select下拉框里的选项分组。不过现在很多时候select这个元素通常被用其他元素wrap来展现，毕竟原生的这个效果不够华丽。

例：

3. <acronym>

这个标签使用在缩写或短语需要进一步解释的情况下。

1

我的小游戏网站 <acronym title="游戏247 欢乐不停歇"> 247</acronym> 欢迎你的来访。

例：我的小游戏网站 247 欢迎你的来访。

4. <address>

<address>标签用于特定信息，如地址、签名、作者、此文档的原创者。

1
2
3

<address>
上海浦东峨山路陆家嘴软件园
</address>

例：

5. <ins>和<del>

对于写blog的同学来说，这两个标签应该是比较熟悉了，特别是一些教程类的文章，在不断的修订中，如果想保留修订信息的话，这两个标签是非常实用的。

1

John <del>likes</del> <ins>LOVES</ins> his new iPod.

例：John likes LOVES his new iPod.

6. <label>

如果你是一个细心并且负责的设计师，那你应该为每一个表单元素添加对应的label，这样既可以最大程度的保证文档性，并能适当的场景下帮助那些使用辅助工具来阅读网页的人士。

1
2

<label for="username">Username</label>
<input id="username" type="text" />

7. <fieldset>

<fieldset>这个标签是展现表单相当好的一种形式。

1
2
3
4
5
6
7

<form><fieldset>
<legend>Are You Smarter Than a 5th Grader?</legend>
Yes <input name="yes" type="radio" value="yes" />
 
No <input name="no" type="radio" value="no" />
</fieldset>
</form>

8. <abbr>

这个倒真是一个非常少见的标签，它的语义和<acronym>类似，但是它没有鼠标悬停时的解释信息，通常只对屏幕阅读器等辅助工具有帮助。

9. rel属性

1

<a rel="clickable" href="page.html">This link is editable</a>

因为每个标签上的rel属性都是合法属性，所以对于离不开javascript的现代网页开发来说，这是最安全的放置特殊变量或者其他信息的地方，比如所有lightbox类库的那些信息。

10. <wbr>

插入一个软换行符，只有在有换行需要的时候才会换行，听上去不错，但似乎几乎没有人会使用这个标签。

=========================
注意：以上这些标签不能完全兼容所有浏览器，标签有风险，使用需谨慎。