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.查询语句 ...
随机推荐
- linq语句复杂查询和分开查询的性能对比
刚开始以为复杂的linq语句查询会不会比分开来写效率高,因为复杂的语句关联和嵌套多,执行应该慢.分开写虽然多了一次io处理,但是关联比较少,数据了比价少,和朋友讨了一下,回家就做了个测试,废话不多说, ...
- PPT要你好看---读书笔记
PPT要你好看.主要是设计的思维. 下图,对于现阶段的我来说,收获最大的是毕业答辩PPT的制作. 以及整体的PPT制作思路.
- poj1182食物链,经典带权并查集
动物王国中有三类动物A,B,C,这三类动物的食物链构成了有趣的环形.A吃B, B吃C,C吃A. 现有N个动物,以1-N编号.每个动物都是A,B,C中的一种,但是我们并不知道它到底是哪一种. 有人用两种 ...
- 在Mvc中进行异步请求是出现(没有为该对象定义无参数的构造函数)
解决办法就是给相应的类添加无参数的构造函数:
- 【Android Widget】1.TextView
1.创建可被点击的TextView 1.1 在xml中创建可被点击的TextView android:autoLink 是否将符合指定格式的文本转换成可单击的超链接. 属性值可以是如下几个属性值的一个 ...
- Web 版 powerdesigner (Canvas) 技术分享
演示地址:http://www.netuml.com:8088 <canvas></canvas>是HTML5出现的新标签,像所有的dom对象一样它有自己本身的属性.方法和事 ...
- React Native技术做的一个项目“微笑阅读”
最近用React Native做了一个APP应用,有点心得: React Native确实比Hybrid应用渲染快,响应快,用户体验更好: React Native比原生简单多了,会Js就可以了,开发 ...
- WPF 简易手风琴 (ListBox+Expander)
概述 之前听说很多大神的成长之路,几乎都有个习惯--写博文,可以有效的对项目进行总结.从而提高开发的经验.所以初学WPF的我想试试,顺便提高一下小学作文的能力.O(∩_∩)O哈哈~ 读万卷书不如行万里 ...
- 学习笔记:JavaScript-入门篇
1.对话框,输出框,警告框 1. document.write() 可用于直接向 HTML 输出流写内容.简单的说就是直接在网页中输出内容. 2.alert(字符串或变量); 3.conf ...
- Docker+SpringBoot+Mybatis+thymeleaf的Java博客系统开源啦
个人博客 对于技术人员来说,拥有自己的个人博客应该是一件令人向往的事情,可以记录和分享自己的观点,想到这件事就觉得有意思,但是刚开始写博客的时候脑海中是没有搭建个人博客这一想法的,因为刚起步的时候连我 ...