HTML中那些不常用标签
先思考一个问题:为什么H5里面又多了那么多看似没用的标签?
我们知道,<div>能干百分之99的标签能干的事,而标签的主要作用是用来包裹内容,只要把基本内容都包含进去不就好了??胡闹!不带这么将就了!!程序员大多可都是追求完美的,标签的语义化才是我们选择使用哪个标签的首要因素。当然,H5的很多新标签在一些老版本流浪器中还不能得到很好的支持,那就需要引用腻子脚本去兼容大多数浏览器了。
1、<cite>和<blockquote>
这俩个标签都有定义文本引用的语义,<blockquote>定义的是块引用,默认有缩进,开始结尾都与其他元素有一行间隔,官方要求它内部应该包含一个块级元素。而<cite>通常表示它所包含的文本对某个参考文献的引用,比如书籍或者杂志的标题,内容比较少,默认是斜体的。
比如: 张三的突破性专著<cite>张三自传</cite>给网络带来一股新气象.
显示为:张三的突破性专著张三自传给网络带来一股新气象.
2、<optgroup>
当你想在一个下拉框中对根据不同类型分组的选项添加一些定义时,<optiongroup>标签将会非常有用。例如,如果你想根据时间对食物进行分组,代码可以这样写:
<select>
<optgroup label="水果">
<option value="">苹果</option>
<option value="香蕉">Saab</option>
</optgroup>
<optgroup label="蔬菜">
<option value="白菜">Mercedes</option>
<option value="西红柿">Audi</option>
</optgroup>
</select>

3、<abbr>
HTML5中已经消灭了<acronym>,所以熟悉<acronym>的童鞋记得不要再用它了,改用<abbr>吧,简单省事。来看看这个新标签的作用,通过对缩写进行标记,您能够为浏览器、拼写检查和搜索引擎提供有用的信息。使用这个标签时,我们只需定义英文首字母就可以了,详细信息交给title属性,相信大家对这个属性不会陌生,当鼠标移到这个缩写单词上面时,显示title里的内容。
4、<address>
<address> 标签定义文档或文章的作者/拥有者的联系信息。其中的文本通常呈现为斜体。大多数浏览器会在 address 元素前后添加折行。
提示:<address> 标签不应该用于描述通讯地址,除非它是联系信息的一部分。
提示:<address> 元素通常连同其他信息被包含在 <footer> 元素中。
5、 <ins> 和 <del>
如果你想通过标记来显示文档编辑样式,<ins>和<del>刚好可以用到。就像它们的名字,<ins>通过一个下划线来突出那些被添加进文档的内容,而<del>则通过删除线来显示那些从中删除的文字。
比如:
<p>价格:<ins>¥120</ins> <del>¥180</del> </p>
显示效果: 价格:¥120 ¥180
6、<label>
<label>的for属性关联到另一个标签的id,用户点击<label>的内容就相当于点击了被关联的那个id标签。不用for关联的话也可以直接把需要关联的标签写到<label>内部。
<form>
<label>Male<input type="radio" name="sex" /></label> <!--用法1-->
<br />
<label for="female">Female</label> <!--用法2-->
<input type="radio" name="sex" id="female" />
</form>
7、<fieldset>
<fieldset>是一个相当好用的标签,它可将表单内的相关元素按逻辑分组,将表单内容的一部分打包,生成一组相关表单的字段。
<form>
<fieldset>
<legend>健康信息</legend>
身高:<input type="text" />
体重:<input type="text" />
</fieldset>
</form>
健康信息:身高: 体重:
8、<bdo>定义文本方向
估计这个标签很多人都没见过吧,毕竟谁没人把文本方向倒着排啊。其dir属性规定了文本方向,ltr/rtl。
<bdo dir="rtl">Here is some Hebrew text.</bdo>
显示效果: .txet werbeH emos si ereH
9、ruby、rt、rp
<ruby>
奣<rt> weng <rp>(不支持ruby)</rp></rt>
</ruby>
标签定义 ruby 注释(中文注音或字符),当不支持<ruby>标签时,显示<rp>内容,支持则不显示<rp>内容。
目前就整理这些鲜为人知但有必要了解的标签,后续还会添加...
HTML中那些不常用标签的更多相关文章
- HTML meta标签的用法及head中的一些常用标签
meta是用来在HTML文档中模拟HTTP协议的响应头报文.meta主要为分HTTP标头信息(HTTP-EQUIV)和页面描述信息(NAME)标头信息包括文档类型.字符集.语言等浏览器正确显示网页的信 ...
- unity中 TextMeshPro 的常用标签
这个第二和第三个写反了. 例子10中的123标签需要用到另一个字体,详情看 TextMeshPro 的官方示例10.
- HTML中body内常用标签
基本标签 <b>加粗</b> <i>斜体</i> <u>下划线</u> <s>删除<s/> <p& ...
- 01: html常用标签
目录: 1.1 web开发的三把利器介绍 1.2 网页头部head标签中几个常用标签 1.3 html常用标签归类 1.4 input系列标签 1.5 HTML其他标签 1.1 web开发的三把利器介 ...
- java web中jsp常用标签
在jsp页面开发过程中,经常需要使用JSTL(Java Server Pages Standard Tag Library)标签开开发页面,是看起来更加的规整舒服. JSTL主要提供了5大类标签库: ...
- Struts2页面开发中常用标签使用说明
1. Struts2页面开发中常用标签使用说明 1.1.往action里传值的使用方式: <input name="userName" type="text&quo ...
- html中的一些常用的样式标签
html中的一些常用的样式标签 <p>这里是文本,<mark>高亮</mark></p> <strong>加粗,加重语气</stron ...
- 04. H5标签有哪些?行内元素有哪些?块级元素有哪些?空(void)元素有哪些?行内元素和块级元素有什么区别?你工作中常用标签有什么?
4. H5标签有哪些? 2)行内元素有哪些? a - 锚点 em - 强调 img - 图片 font - 字体设定 ( 不推荐 ) i - 斜体 input - 输入框 3)块级元素有哪些? add ...
- mapper.xml中的常用标签
mybatis的mapper xml文件中的常用标签 https://blog.csdn.net/qq_41426442/article/details/79663467 SQL语句标签 1.查询语句 ...
随机推荐
- tomcat的环境搭建
tomcat搭建过程还是比较简单的,只需要安装好jdk,然后配置好环境变量,最后把tomcat安装上开启就可以了. 首先下载jdk,然后把下载下来的jdk放到/usr/local下,然后用rpm -i ...
- Java中Properties类
1 简介: JDK提供的java.util.Properties类继承自Hashtable类并且实现了Map接口,用map来存储key-value数据,所以存入的数据是无序的.其中键和值都是字符串类型 ...
- 浅谈Web的流量控制
想聊一聊流量控制,谈谈的重要性,解决了哪些业务问题,那我们问题来进入正题. 1.WEB容器如何流量控制? 一个Tomcat的容器,这个容器呢,部署在一台服务器上面,同时这台服务器的资源非常非常 ...
- C#基础知识-流程控制的应用(四)
流程控制我们在编程中运用到的地方非常的多,在上篇中仅仅只是简单的介绍每一种的使用,并没有运用到实例中,很难去理解它真正的作用.下面我们将实际的运用流程控制的代码写一些实例相关的程序,加深对流程控制的理 ...
- 浅谈OA办公软件市场行情
3.原文:http://www.jiusi.net/detail/472__776__3999__1.html 关键词:oa系统,OA办公软件 浅谈OA办公软件市场行情 中国的OA办公软件市场历经20 ...
- 2016年BAT公司常见的Web前端面试题整理
1.JavaScript是一门什么样的语言,它有哪些特点? 没有标准答案. 2.JavaScript的数据类型都有什么? 基本数据类型:String,boolean,Number,Undefined ...
- c#枚举值增加特性说明
c#枚举值增加特性说明 通过特性给一个枚举类型每个值增加一个字符串说明,用于打印或显示. 自定义打印特性 [AttributeUsage(AttributeTargets.Field)] public ...
- 学习笔记:JavaScript-进阶篇
1.二维数组 二维数组的表示: myarray[ ][ ] var myarr=new Array(); //先声明一维 for(var i=0;i<2;i++){ //一维长度为2 ...
- ArcGIS 网络分析[1.5] 使用点线数据一起创建网络数据集(如何避免孤立点/点与线的连通性组合结果表)
ArcGIS中最基本的三种矢量数据是什么?点线面. 网络中除了路网之外,还会有地物点. 如上图,我们在建立网络数据集的时候,作为实验,当然可以只是公路网.但是在大型的决策任务中,网络数据集就不只是公路 ...
- LeetCode:36. Valid Sudoku,数独是否有效
LeetCode:36. Valid Sudoku,数独是否有效 : 题目: LeetCode:36. Valid Sudoku 描述: Determine if a Sudoku is valid, ...