在菜鸟教程中找了一些关于HTML5的知识点,觉得很有用,可以整理一下,以后使用。
这是一个基本的HTML5文档:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文档标题</title>
</head>
<body>
文档内容......
</body>
</html>
判断是不是HTML5?看两个地方就够了------<!DOCTYPE html>,<meta charset="utf-8">,只要这两个格式正确,就可以确定了。
下面说一下HTML5标签的使用方法和作用
<!--...--> 注释标签用来在源文档中插入注释。注释不会在浏览器中显示。
<a href="http://www.baidu.com"></a><a href=""></a>这是一个超链接标签。
<abbr> 标签用来表示一个缩写词或者首字母缩略词,如"WWW"或者"NATO"。
The<abbr title="World Health Organization">WHO</abbr> was founded in 1948. (当你的鼠标在WHO上悬停的时候,它会出现World Health Organization)
<address>标签
<address>
Written by <a href="mailto:webmaster@example.com">Jon Doe</a>.<br>
Visit us at:<br>
Example.com<br>
Box 564, Disneyland<br>
USA
</address>
显示出的效果通常都是斜体字。如果<address>元素位于<body>元素内部,则它表示该文档作者/所有者的联系信息。
如果<address>元素位于<article>元素内部,则它表示该文章作者/所有者的联系信息。
后期学习新增:
<header></header>它就是主体的头部,也可以把它看成页眉。每一页都有,在最上面。放置logo,*导航这样一些内容。
<footer></footer>页面主体上的底部,也就是文档上的页脚,一般会放些版权声明,联系方式等等内容
<nav></nav>它是代表页面中的导航链接的部分,一般有导航的话,就会有这个标签
<article></article>它代表文档啊,页面啊,或者应用程序中独立的完整的一些可以独自外部引用的内容,比如说:博客里的一篇文章,一个帖子等等与之比较类似的是<section></section>
<section></section>.的适用范围更广泛,比如页面里的广告,联系方式,文章里面的章节等等,只要你觉得只是个区块就可以使用,在文档内容明确的出现在大纲里,它就比较适用。如果你这个东西只是个装饰,就不用了,但是出现在文档大纲中,由用户看到的,有意义的内容就可以使用。<article></article>就可以看成是一个特殊的<section></section>,是<section></section>的子集,包含图文内容的文章,就可以使用<article></article>,<article></article>的语义更加的强烈
<b></b>不仅仅是加粗,还表示这段文本是用来吸引人注意的,但并不表示这是重点或者是强调
<em></em>表示重点强调,比如说公式,定理一段文字的
<i></i>不同的语气,样子上有不同的差异,有些区别,比如说这段文字表示了讽刺,文法与其他的不一样啊。
HTML5标签的使用和作用的更多相关文章
-
HTML5中常用的标签(及标签的属性和作用)
1.标签:<!DOCTYPE>作用:声明是文档中的第一成分,位于<html>标签之前. 2.标签:<html>作用:此元素可告知浏览器其自身是一个HTML文档.属性 ...
-
html5标签兼容ie6,7,8
注册博客园已经三年了,这三年一直在忙,没时间写博文.也许是忙,也许是懒吧!当然这三年发生了很多事,我也从开发人员转变为前端人员. 是时候对所学的,所用的知识做一下沉淀了.就从这一篇开始吧! html5 ...
-
对HTML5标签的认识(三)
这篇随笔继续来认识HTML标签.这次随笔主要是对<table>标签的认识和最近我学习到的一些标签来和大家分享. 一.<table>标签 <table>标签的作用主要 ...
-
对HTML5标签的认识(二)
---恢复内容开始--- 这次随笔主要讲一下列表标签.链接标签.和表格标签.图像标签.音频标签.及视频标签的运用及作用. 一.<ul>和<ol> 首先先了解一下<ul&g ...
-
HTML5 Shiv完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法
这篇文章主要介绍了HTML5 Shiv完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法,需要的朋友可以参考下 HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面 ...
-
HTML5标签构成
一个HTML5文件是由一些列的元素和标签组成的.元素是HTML5文件的重要组成部分,例如title(文件标题).img(图像)及table(表格)等.元素名不区分大小写,而HTML5用标签来规定元素的 ...
-
完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法
完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法 HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面布局,加上CSS3的效果渲染,快速建立丰富灵活的web页 ...
-
HTML5标签与HTML4标签的区别示例介绍_html5教程技巧
(1)概念的变化: HTML5专注内容与结构,而不专注的表现 <header> <hgroup>导航相关数据</hgroup> </header> &l ...
-
解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法
方式一:Coding JavaScript <!--[if lt IE9]> <script> (function() { var e = "abbr, articl ...
随机推荐
-
javascript的一点学习
最近用vue.js用的很爽,在全栈开发的路上一路狂奔,发现后台跟前台一起确实更有意义. 记录一个比较有意思的bug: 目标是对一个全局的paramList进行json格式化显示.代码借鉴了 http: ...
-
SoapUI 使用笔记
1. 构建项目 安装完成后 右键Project --> New SOAP Project 在弹出的 New SOAP Project框中输入名字 和 webservice服务地址(example ...
-
sdutoj 2608 Alice and Bob
http://acm.sdut.edu.cn/sdutoj/problem.php?action=showproblem&problemid=2608 Alice and Bob Time L ...
-
lnmp全面优化集合nginx+mysql+php
lnmp的全名是linux+nginx+mysql+php,既然是全面优化那我们就从linux系统的选择入手.debian系统可以算是 linux各分支中做的比较突出的一类,连谷歌都抛弃linux订制 ...
-
微信开放平台 获取 component_verify_ticket
<?php /** * @author zhaozhuobin * @date:2016-06=07 * */ namespace common\components;use DOMDocume ...
-
QEMU-KVM自己主动创建虚拟机,以指定IP构造
正在使用qemu不能指定创建虚拟机的过程IP住址,然而,在实际应用中,我们需要有一台虚拟机IP住址,不是人为的虚拟机操作系统配置. 于qemu虚拟机技术文档(http://qemu.weilnetz. ...
-
InnoDB Undo Log
简介 Undo Log包含了一系列在一个单独的事务中会产生的所有Undo Log记录.每一个Undo Log记录包含了如何undo事务对某一行修改的必要信息.InnoDB使用Undo Log来进行事务 ...
-
RandomAccessFile&;IO流&;排序&;方法论
RandomAccessFile&IO流&排序&方法论 我们总觉得历史是极其遥远的东西,与我们并无关联,又觉得历史隐藏在图书馆的旧书之中. 然而,我们每个人都有真真切切的历史. ...
-
topcoder srm 630 div1 (2-SAT and SCC template)
problem1 link 首先计算任意两点的距离.然后枚举选出的集合中的两个点,判断其他点是否可以即可. problem2 link 假设字符串为$s$,长度为$n$.那么对于$SA$中的两个排名$ ...
-
测试同学必备抓包工具--charles之mock数据
charles中有三个是我经常用到来mock数据的. 一. 打断点--Breakpoints 1. 先切换查看‘Structure’模式 2. 找到目标链接,对其父级进行打断点,如图 3. 取消掉再次 ...