html语意化标签
一、布局的理解误区
网络上流行管新型的布局方式叫“DIV+CSS”,其实是一个错误的理解,导致了很多人过度依赖 与滥用DIV标签, HTML提供了我们一共七八十个标签,其中常用的有三十个左右,DIV不过是一个相对的空标签而已,在很多情况下,我们可以使用其他更合适且更简洁的标签 可以替代它。
二、标签的差异
共性:都是一个容器,可以在其中放置内容
差异:分为行内和块级两个大类,且不同便签有相应含义上的预设,如:h-标题,p-段落,a-链接,等等
三、标签语义化的好处
a、让结构更简洁,让搜索引擎更友好
b、通过多重组合,减少不必要的CSS命名
四、语义化标签的使用
a、列表:ul、ol、li、dl、dt、dd
b、标题:h1~h6
c、段落:p
d、强调:strong
e、表格:table、tr、td,以及表格的其他成员th、thead、tbody、tfood
附录:常用HTML标签表
红色:结构标签 黑色:行内元素 蓝色:块级元素 绿色:表格元素 灰色:其他标签
| <!--...--> | 定义注释。 |
|---|---|
| <body> | 定义文档的主体,默认有外边距,注意清除。 |
| <head> | 定义页面的信息。 |
| <html> | 定义 HTML 文档。 |
| <meta> | 定义页面的描述信息,便于搜索优化。 |
| <title> | 定义文档的标题。 |
| <link /> | 定义引用外部文件,如联入CSS样式表。 |
| <style> | 定义内联的CSS样式信息。 |
| <script> | 定义内联或外联的客户端脚本,如JS。 |
| <a> | 定义锚链接或其他链接,行内元素。 |
| <img /> | 定义引入一张图片,行内元素。 |
| <strong> | 定义强调文本,样式为加粗,行内元素。 |
| <span> | 定义一个行内元素的空盒子。 |
| <div> | 定义一个块级元素的空盒子。 |
| <h1> to <h6> | 定义标题部分,默认有外边距,块级元素。 |
| <ul> | 定义无序列表,默认有外边距和内边距,块级元素。 |
| <ol> | 定义有序列表,即数字列表,默认有内外边距,块级元素。 |
| <li> | 定义列表的项目,一般被嵌套在<ul>和<ol>内,块级元素。 |
| <dl> | 自定义列表的项目,默认有外边距和内边距,块级元素。 |
| <dt> | 自定义列表的标题,嵌套在<dl>内,与<dd>区别,块级元素。 |
| <dd> | 自定义列表的内容,嵌套在<dl>内,与<dt>区别,块级元素。 |
| <p> | 定义段落,默认有一个行高的外边距。 |
| <table> | 定义表格。 |
| <tr> | 定义表格中的行。 |
| <td> | 定义表格中的单元。 |
| <th> | 定义表格中的表头单元格。 |
| <thead> | 定义表格中的表头内容。 |
| <tbody> | 定义表格中的主体内容。 |
| <tfoot> | 定义表格中的表注内容(脚注)。 |
| <br /> | 定义一个回车换行。 |
| <map> | 定义图像映射,即鼠标热区。 |
| <area> | 定义图像映射内部的区域。 |
| <form> | 定义输入提交的表单。 |
| <button> | 定义表单中的按钮 (push button)。 |
| <input> | 定义表单中的输入控件。 |
| <select> | 定义表单中的选择列表(下拉列表)。 |
| <frame> | 定义框架集的窗口或框架。 |
本文转载于:http://www.th7.cn/web/html-css/201401/17358.shtml
html语意化标签的更多相关文章
- html5语义化标签使用规范
Html5添加了很多语义化标签,一个典型的html5页面结构可以如下安排 一.使用案例 1. 头部——header和nav标签 header头部,body下的直接子元素header一般用于放页面的介绍 ...
- HTML5 常用的结构化标签整理
一.语义化结构化标签 结构化标签优点: 1.方便浏览器处理和识别,提升了网页的质量和语义. 2.减少了大量无意义的div标签,增强代码的可读性. 结构化标签:(header,nav,body,arti ...
- HTML5语义化标签
在HTML5中最基础也是比较好理解的也就是语义化标签了,,顾名思义语义化也就是可以直接读懂的标签~,这样我们在项目开发过程中不但自己不会因为5花8门的标签命名而伤脑筋,跟同事对接项目也会节约很多时间~ ...
- 让HTML5语义化标签兼容IE浏览器
解决方案:IE9以下旧版本浏览器不支持新的语义化标签.其中一种解决方案就是用js将HTML5增加的标签创建出来,就像下面这样.(放在header部位) <script> var html5 ...
- HTML5之语义化标签
HTML 5的革新之一:语义化标签一节元素标签. 在HTML 5出来之前,我们用div来表示页面章节,但是这些div都没有实际意义.(即使我们用css样式的id和class形容这块内容的意义).这些标 ...
- 浅谈html语义化标签,Html5新增语义化标签
Html语义化标签,Html5新增语义化标签 自己在学习的期间,整理了下html关于语义化标签的一些知识,列的不是很全. 希望大家有新的见解可以给我留言,我会补充上去,谢谢大家 1.什么是语义化标签? ...
- HTML5结构化标签
一 结构化标签 在之前的HTML页面中,大家基本上都是用了Div+CSS的布局方式.而搜索引擎去抓取页面的内容的时候,它只能猜测你的某个Div内的内容是文章内容容器,或者是导航模块的容器,或者是作者介 ...
- Html5新增的语义化标签(部分)
2014年10月29日,万维网联盟宣布,经过接近8年的艰苦努力,html5的标准规范终于制定完成.这是互联网的一次重大变革,这也许是一个时代的来临! 总结一些h5新增的语义化标签,记录下来方便自己学习 ...
- HTML&CSS基础学习笔记1.21-语义化标签
语义化标签 “语义化”指的是机器在需要更少的人类干预的情况下能够研究和收集信息,让网页能够被机器理解,最终让人类受益. HTML 标签语义化是让大家直观的认识标签和属性的用途和作用,很明显<hx ...
随机推荐
- 在fedora 桌面上添加应用程序
在网上下了个android studio,这个程序只是的压缩包,解压后程序也只能在SHELL下敲入studio.sh才能运行 能不能向其他程序一样,在fedora桌面上找到应用程序,点击执行呢.在网上 ...
- Eclipse开发Android报错Jar mismatch! Fix your dependencies
常常打开工程,发现项目并没有错,但是会有一个红X,然后就生成不了. 发现两个版本不同的android-support-v4.jar在使用 打开window-show views-problems Ja ...
- JS禁用浏览器退格键
我们在真实的项目开发中经常会使用JS 对键盘上的一些按键进行禁用,常见的比如说退格键(backspace/ 后退键),我在一个项目中就遇到过在页面编辑的时候禁用掉退格键,因为退格键会发生页面后退,代码 ...
- Create a SharePoint Application Page for Anonymous Access
http://dishasharepointworld.blogspot.com/2011/07/how-to-create-sharepoint-application_1072.html http ...
- linux驱动系列之文件压缩解压小节(转)
转至网页:http://www.jb51.net/LINUXjishu/43356.html Linux下最常用的打包程序就是tar了,使用tar程序打出来的包我们常称为tar包,tar包文件的命令通 ...
- 自己开发开源jquery插件--给jquery.treeview加上checkbox
很多时候需要把树状的数据显示除来,比如分类,中国省份.城市信息,等,因此这方面的javascript插件也有很多.比如性能优异的jquery.treeview和国人开发的功能强大的zTree. 我最近 ...
- KafkaSpout: PartitionManager的行为分析
KafkaSpout的核心逻辑都是由PartitionManager来实现的. 但是这个类实现时候需要考虑的东西有些多,0.92至0.93,至当前(2015.3.14)的master一直在变化.在这里 ...
- 基于Oracle OCI的数据访问C语言接口ORADBI .
基于Oracle OCI的数据访问C语言接口ORADBI cheungmine@gmail.com Mar. 22, 2008 ORADBI是我在Oracle OCI(Oracle 调用接口)基础 ...
- PowerDesigner15(16)在生成SQL时报错Generation aborted due to errors detected during the verification of the mod
1.用PowerDesigner15建模,在Database—>Generate Database (或者用Ctrl+G快捷键)来生产sql语句,却提示“Generation aborted d ...
- HDU 5039 Hilarity
题意:一棵树n个结点,每条边有0.1两种权值,每次询问权值为奇数的路径数目,或者改变某一条边的权值. 分析:这个题目很巧妙低利用了异或和的特性,dfs得到每个点到根结点的权值异或和,然后奇数则为1,偶 ...