动态网站制作指南



当前位置 > 网站建设学院 > 网页制作 > HTML教程 Rss

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


发表日期:2006-3-26


  我们知道HTML是一种再简单不过的标记语言,一些基础性的知识,该说的已经说了,该讲的也已经讲得差不多了,没有人再去关注HTML还有什么新颖之处,其实不然,也许我们熟悉的只是HTML中极为常见的标记,但对于一些特殊的标记,您未必熟悉也未必使用过,但也许您会真的喜欢它们。

  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<sub>2</sub>
X<sup>2</sup> 

  出来的效果是这样的:   

  X2  

  X2 

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

毛泽东<sub><em>注:伟大的领袖、革命家、军事家和思想家</em></sub>  

  出来的效果是这样的:   

  毛泽东注:伟大的领袖、革命家、军事家和思想家  

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

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

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

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

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

  其显示结果为: 

  我非常爱你  

你爱常非我   

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

作者:猴年马月出处:天极网

关注此文的读者还看过:
·2012-2-7 20:30:32 页面上所有的链接都在新窗口打开
·2012-2-7 20:16:10 轻松搞定网页设计(html.css.js)第3讲.超链接href.图像image.表格table
·2012-2-7 20:15:23 轻松搞定网页设计(html.css.js)第1讲.html介绍
·2012-2-7 20:12:31 分析:input表单输入框默认提示信息
·2012-2-7 20:04:44 技巧运用无极限 HTML表格使用从入门到精通
·2012-2-7 20:00:26 HTML4标签的默认样式列表
·2012-2-7 20:00:06 使用Web标准建站第1天:选择什么样的DOCTYPE
·2012-2-7 19:42:01 [视频]一款HTML5游戏引擎 - Aves
·2012-2-7 19:39:03 带有图片预览功能的上传表单的完整HTML
站长推荐 PS笔刷下载 在线翻译 系统进程 广告代码
  发表评论
姓 名: 验证码:
内 容:
教程搜索服务
项目外包信息
·找长期合作的网页设计师(切图+
·SNS 网站开发
·云南大蓄文化传播有限公司网站设
·药品代购网站
·FLASH网站汉化
·求高手帮我设计一个减肥产品网站
·flash首页制作(已有设计图)
·寻求长期外包人员
·网页页面修改
·北京地区 flash动画合作
·佛山网站建设+263企业邮箱找我。
·ecshop+Discuz! X2+ Home会员整
·寻找网站建设团队或者个人合伙
·LOGO设计外包
·企业网后台程序外包
发布信息 浏览信息
邮件订阅服务
输入你的邮件地址,你将不会错过任何关于<HTML教程>的内容


网页制作文章分类
Dreamweaver教程
FrontPage教程
Javascript教程
CSS教程
DHTML教程
HTML教程
网页特效
心得技巧
Discuz!专栏
站长工具:Google PR查询|Alexa排名查询|网站速度测试|CSS在线编辑器|OPEN参数生成器|弹出式窗口代码产生器|密码登录生成器|在线按钮生成器|Meta标签生成器|邮箱图标在线生成|多色彩特效字代码生成器|网页代码调试器|在线FTP登陆|Flash取色器|配色代码对照表|配色辞典|CSS生成器|CSS在线压缩|广告代码|框架网页代码生成器|js/vbs加密|md5加密|进制转换|UTF-8 转换工具|在线调色板|Html转换js|Html转换asp|Html转换php|Html转换perl
实用工具:汉字翻译拼音|拼音字典|在线翻译|天气预报|火星文|在线网速测试|符号对照表|个税计算|理财工具|黄金价格|购房银行按揭利率计算|汇率查询|经典小工具|汉字简繁转换|普通单位换算|公制单位换算|生辰老黄历|国内电话区号|国家代码与域名缩写|文字加密解密|元素周期表|健康查询|世界时间|全国各地车牌查询|全国车辆交通违章查询|万年历|二十四节气|汉字横竖排版|手机号码查询|计算器|ip搜索
广告刊登 | 版权声明 | 联系我们 | 加入收藏 | RSS订阅
Copyright © 2000-2012 www.knowsky.com All rights reserved | 沪ICP备05001343号