分享HTML中少为人知的个性化标记

• 标记
• 个性化
• 为人
• 分享
• 元素
• /option
• option

1、optgroup标记-对select元素中的选项进行逻辑分组

这个元素我们很少有人去关注它，也很少有人知道这个元素的功能是什么，其实，这个元素通常用于select元素中，其功能是对select元素中的选项进行逻辑分组。这个元素其实在很多场合我们都可能用到，比如我们对web访问者进行身份调查时通常会让其填写资料，以现住城市为例，您可能住在江苏省也可能住在山东省也可能住在其它省份，在这些省份下面还有市，这就需要进行分组，把这些市分组到所属省。通常情况下我们会这样写代码：

<select>
<option selected>您所在的城市</option>
<option>---山东省---</option>
<option>济南市</option>
<option>莱州市</option>
<option>……</option>
<option>---安徽省---</option>
<option>合肥市</option>
<option>……</option>
<option>---江苏省---</option>
<option>南京市</option>
<option>……</option>
</select>

出来的效果是这样的： 您所在的城市 ---山东省--- 济南市 莱州市 …… ---安徽省--- 合肥市 …… ---江苏省--- 南京市 ……

其实这种方法是非常粗陋的，如果我们用optgroup元素将会达到不一样的效果：

<select>
<option selected>您所在的城市</option>
<optgroup label="山东省">
<option>济南市</option>
<option>莱州市</option>
</optgroup>
<optgroup label="安徽省">
<option>合肥市</option>
<option>……</option>
</optgroup>
<optgroup label="江苏省">
<option>南京市</option>
<option>……</option>
</optgroup>
</select>

出来的效果是这样的： 您所在的城市 济南市 莱州市 合肥市 …… 南京市 ……

这种方法是不是更好呢。

2、sub标记和sup标记-文字对象的上、下标设置

sub标记是内嵌元素，其功能是：内含文本要以下标的形式显示，比当前字体稍小。此元素在 Internet Explorer 3.0 及以上版本的 HTML 中可用，在 Internet Explorer 4.0 及以上版本的脚本中可用。此元素需要关闭标签。

一个常见的例子就是在编辑数学公式时我们要对变量进行上下标设置，实例如下：

X₂
X²

出来的效果是这样的:

X₂

X²

与其他标签结合可以用于注释,例:

毛泽东_{<em>注：伟大的领袖、革命家、军事家和思想家</em>}

出来的效果是这样的:

毛泽东_{注：伟大的领袖、革命家、军事家和思想家}

3、bdo标记-为选定文本片断禁用双向法则

我们先来看一个简单的例子：

<bdo dir="ltr">我非常爱你</bdo>

<bdo dir="rtl">你爱常非我</bdo>

注：使用bod标签时必须连用dir标签属性，ltr指从左到右的编排顺序，rtl指从右到左的编排顺序。

其显示结果为：

我非常爱你

你爱常非我

我们看到，不一样的文本排序在经过bdo定义后变成了一样的显示结果，这就是bdo的作用。Unicode 双向算法会根据所嵌入的字符序列的方向特性将其自动反转。例如，英语文档的基本方向是由左至右(ltr)。如果文档内某一段包含了阅读顺序为由右至左(rtl)的语言，你就可以应用双向算法来反转该语言的方向。双向算法和 DIR 标签属性通常足以应付嵌入方向的变更。但是，当你将格式化后的文本交由双向算法处理时，可能会发生错误。例如，以电子邮件格式化后的包含英语和希伯莱语的文本段将被双向算法不正确地转换。由于希伯莱语文本的阅读顺序已经以电子邮件格式转换过了，对其应用双向算法则导致再一次对该文本进行转换。bdo元素将关闭双向算法并控制阅读顺序。当你使用bdo元素时必需连用dir标签属性。