文档的类型声明不同

html:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

html5:文档声明相对来说更为简便,有利于程序员快速阅读和开发。<!DOCTYPE html>

语义结构方面

html:没有结构语义化的标签(通俗来讲就是不方便阅读,没有告诉你哪里是头,哪里是尾巴)

html5:添加了许多具有语义化的标签,

使代码结构清晰,提高了代码的可读性。

下面是html5中的一些语义化标签:

< title></title>:简短、描述性、唯一(提升搜索引擎排名)

<hn></hn>:h1~h6分级标题,用于创建页面信息的层级关系。

<header></header>:页眉通常包括网站标志、主导航、全站链接以及搜索框。

也适合对页面内部一组介绍性或导航性内容进行标记。

<nav></nav>:标记导航,仅对文档中重要的链接群使用。

<main></main>:页面主要内容,一个页面只能使用一次。如果是web应用,则包围其主要功能。

<article></article>:表示文档、页面、应用或一个独立的容器.

<section></section>:具有相似主题的一组内容,比如网站的主页可以分成介绍、新闻条目、联系信息等条块。

<aside></aside>:指定附注栏,包括引述、侧栏、指向文章的一组链接、广告、友情链接、相关产品列表等。

<footer></footer>:页脚,只有当父级是body时,才是整个页面的页脚。

<small></small>:指定细则,输入免责声明、注解、署名、版权。

只适用于短语,不要用来标记“使用条款”、“隐私政策”等长的法律声明。

<strong></strong>:表示内容重要性。

<em></em>:标记内容着重点(大量用于提升段落文本语义)。

<mark></mark>:突出显示文本(yellow),提醒读者。

在HTML5中em是表示强调的唯一元素,而strong则表示重要程度。

<b></b>:出于实用目的提醒读者的一块文字,不传达任何额外的重要性

<i></i>:不同于其他文字的文字= =|||这个翻译真的是······

<figure></figure>:创建图(默认有40px左右margin)。

<figcaption></figcaption>:figure的标题,必须是figure内嵌的第一个或者最后一个元素。

<cite></cite>:指明引用或者参考,如图书的标题,歌曲、电影、等的名称,演唱会、音乐会、规范、报纸、或法律文件等。

只用于参考源本身,而不是从中引述。

<blockquoto></blockquoto>:引述文本,默认新的一行显示。

<q></q>:短的引述(跨浏览器问题,尽量避免使用)。

可以对blockquoto和q元素使用cite属性(不是cite元素!),对搜索引擎自动化工具有用。cite=“URL”引述来源地址。

<time></time>:标记时间。datetime属性遵循特定格式,如果忽略此属性,文本内容必须是合法的日期或者时间格式。 不再相关的时间用s标签。

<abbr></abbr>:解释缩写词。使用title属性可提供全称,只在第一次出现时使用就ok。

abbr[title]{ border-bottom:1px dotted #000; }

<dfn></dfn>:定义术语元素,与定义必须紧挨着,可以在描述列表dl元素中使用。

<address></address>:作者、相关人士或组织的联系信息(电子邮件地址、指向联系信息页的链接)。

如果提供整个页面的作者联系信息,一般放在页面级footer里。不能包含文档或者文档等其他内容。

<del></del>:移除的内容。

<ins></ins>:添加的内容。

少有的既可以包围块级,又可以包围短语内容的元素。

<code></code>:标记代码。包含示例代码或者文件名 (< > )

<pre></pre>:预格式化文本。保留文本固有的换行和空格。

html与HTML5的区别的更多相关文章

  1. HTLM4与HTML5的区别

    准确的说应该是HTML4与HTML5的区别 主要区别: 1.doctype头的改变 2.html5中多出了很多标签和属性 还有一个要注意的是,我们通常说html5时会自动关联上css3,其实我理解的, ...

  2. html4与html5的区别及html5的一些新特性

    区别 1.html5语法的改变 HTML5简化了很多细微的语法,例如: 1.1doctype的声明; html4: <!DOCTYPE HTML PUBLIC "-//W3C//DTD ...

  3. html、xhtml、html5的区别

    1.HTML:HyperText Mark-up Language(超文本标记语言)构成网页的主要语言  常指:HTML 4.012.XHTLM:EXtensible HyperText Mark-u ...

  4. XHTML与HTML、HTML5的区别

    XHTML与HTML最主要的区别 XHTML 元素必须被正确地嵌套. XHTML 元素必须被关闭. XHTML标签名必须用小写字母. XHTML 文档必须拥有根元素. HTML5 HTML5是很有野心 ...

  5. 小程序与HTML5的区别

    小程序与传统HTML5还是有明显的区别,主要区别在于: 开发工具不同: 区别于H5的开发工具+浏览器Device Mode预览的模式,小程序的开发基于自己的开发者工具,可以实现同步本地文件+开发调试+ ...

  6. xhtml、html与html5的区别

    一.基本概念: html:超文本标记语言 (Hyper Text Markup Language) xhtml:可扩展超文本标记语言,是一种置标语言,表现方式与超文本标记语言(HTML)类似,不过语法 ...

  7. html和xhtml和html5一些区别和笔记

    XHTML,HTML XHTML 与 HTML 4.01 标准没有太多的不同, XHTML1.0是XML风格的HTML4.01,标签的规范更加严格 , W3C一直是推崇XHTML这种严格类型的语法, ...

  8. html4与html5的区别

    一.HTML5更加灵活,支持下列多种形式 1.标签名可以大写(不推荐) -<SpAN>这个HTML5也的认</SpAN> 2.属性双引号可选(推荐添加双引号) -<div ...

  9. web时代变迁及html5与4的区别

    HTML5的新结构标签 在之前的HTML页面中,大家基本上都是用了Div+CSS的布局方式.而搜索引擎去抓取页面的内容的时候,它只能猜测 你的某个Div内的内容是文章内容容器,或者是导航模块的容器,或 ...

随机推荐

  1. C++ 根据两点式方法求直线并求两条直线的交点

    Line.h #pragma once //Microsoft Visual Studio 2015 Enterprise //根据两点式方法求直线,并求两条直线的交点 #include"B ...

  2. 利用Anaconda软件安装opencv模块

    先说明我安装opencv环境的原因:因为我Anaconda中创建了tensorflow和pytorch虚拟环境,想在每个虚拟环境下都安装opencv模块,这样在后期进行代码调试的时候更加便捷,以下是我 ...

  3. 剑指offer11:输入一个整数,输出该数二进制表示中1的个数。其中负数用补码表示。(进制转换,补码反码)

    1. 题目描述 输入一个整数,输出该数二进制表示中1的个数.其中负数用补码表示. 2. 思路和方法 使用移位(<<)和 “| & !”操作来实现.1的二进制是:前面都是0,最后一位 ...

  4. 利用Python进行数据分析 第6章 数据加载、存储与文件格式(2)

    6.2 二进制数据格式 实现数据的高效二进制格式存储最简单的办法之一,是使用Python内置的pickle序列化. pandas对象都有一个用于将数据以pickle格式保存到磁盘上的to_pickle ...

  5. Python进阶:metaclass谈

    metaclass 的超越变形特性有什么用? 来看yaml的实例: import yaml class Monster(yaml.YAMLObject): yaml_tag = u'!Monster' ...

  6. Python完成迪杰斯特拉算法并生成最短路径

    def Dijkstra(network,s,d):#迪杰斯特拉算法算s-d的最短路径,并返回该路径和代价 print("Start Dijstra Path……") path=[ ...

  7. Nginx学习笔记(五):高级数据结构

    目录 动态数组 单向链表 双端队列 红黑树 缓冲区 数据块链 键值对   动态数组 ngx_array_t 表示一块连续的内存,其中存放着数组元素,概念上和原始数组很接近 // 定义在 core/ng ...

  8. RVA与RWA的关系

    RVA与RWA的关系 原理比较简单:首先判断这个地址是否在PE头中,如果在,文件偏移和内存偏移相等,如果存在于文件的区段中,则利用以下公式: 内存偏移 - 该段起始的RVA(VirtualAddres ...

  9. TextBox 显示横线

    public class Xtxt3 : TextBox { private bool m_underLine; public bool UnderLine { get { return m_unde ...

  10. mysql 查询表的字段名称,字段类型

    select column_name,column_comment,data_type from information_schema.columns where table_name='查询表名称' ...