HTML5标签的使用和作用
在菜鸟教程中找了一些关于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用标签来规定元素的 ...
- 8 个有用的 HTML5 标签
作为一个 web 前端开发者,在制作页面的时候你会从一大堆不同的标签中选择合适的标签来完成相应的功能.有些 HTML5 标签广为流传,例如 <article> <header> ...
- 完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法
完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法 HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面布局,加上CSS3的效果渲染,快速建立丰富灵活的web页 ...
- HTML5标签与HTML4标签的区别示例介绍_html5教程技巧
(1)概念的变化: HTML5专注内容与结构,而不专注的表现 <header> <hgroup>导航相关数据</hgroup> </header> &l ...
随机推荐
- vue项目缓存最佳实践
需求 在开发vue的项目中有遇到了这样一个需求:一个视频列表页面,展示视频名称和是否收藏,点击进去某一项观看,可以收藏或者取消收藏,返回的时候需要记住列表页面的页码等状态,同时这条视频的收藏状态也需要 ...
- [奇思异想]使用RabbitMQ实现定时任务
背景 工作中经常会有定时任务的需求,常见的做法可以使用Timer.Quartz.Hangfire等组件,这次想尝试下新的思路,使用RabbitMQ死信队列的机制来实现定时任务,同时帮助再次了解Rabb ...
- WinForm控件之【CheckBox】
基本介绍 复选框顾名思义常用作选择用途,常见的便是多选项的使用: 常设置属性.事件 Checked:指示组件是否处于选中状态,true为选中处于勾选状态,false为未选中空白显示: Enabled: ...
- Mysql常用增删查改及入门(二)
常用:数据库常用就是DML:增删查改 1.增加数据: insert into 表名 values (值1,值2...); insert into 表名 (字段1,字段2) values (值1,值2) ...
- 运用KeyCode在浏览器中按WASD使图形运动
如何实现在浏览器中按WASD四个键使图形上下左右运动呢? 其实很简单,用keyCode方法就可以实现了. 先放个div在html中: <div id="ball" style ...
- cve-2018-2893 WebLogic
最近爆出来了新的漏洞cve-2018-2893 一.背景介绍 WebLogic是美国Oracle公司出品的一个Application Server,确切的说是一个基于JAVAEE架构的中间件,WebL ...
- 小代学Spring Boot之自定义Starter
想要获取更多文章可以访问我的博客 - 代码无止境. 上一篇小代同学在Spring Boot项目中配置了数据源,但是通常来讲我们访问数据库都会通过一个ORM框架,很少会直接使用JDBC来执行数据库操作的 ...
- 【译】WebAPI,Autofac,以及生命周期作用域
说明 原文地址:http://decompile.it/blog/2014/03/13/webapi-autofac-lifetime-scopes/ 介绍 这是一篇关于AutoFac的生命周期作用域 ...
- java练习---9
//程序员:罗元昊 2017.10.22 package cn.lyh; import com.rupeng.game.GameCore; public class L implements Runn ...
- Python装饰器实现类Java注解功能
最近想用Python写一个简单生成器,类似指定类型和范围,返回指定列表: 比如想要 0 ~ 3 的整数,则 我只需要指定: 最小:0, 最大:3, 步长:1 则返回一个 [0,1,2,3] 的列表 ...