HTML5基本标签
一、HTML5文档类型说明
1、<head>标签
head中主要放关于网页设置的相关语句。


链接文件,要有属性及属性值
例,链接小图标代码:

1、设置网页的字符集编码格式:
GB2312:国标码。简体中文的编码格式。
GBK:扩展的国标码。比国标吗多了更多的编码格式。
utf-8;万国码。可以兼容绝大多数国家的语言。
html4.01之前,声明字符集编码的格式:<meta http-equiv="Content-type" content="text
name="keywords"表示当前语句用于设置网页关键字
content=""表示网页的关键字内容。多个关键字之间用英文逗号分隔。
3、设置网页描述
<meta name="description" content="这是我开发的第一个网页。"/>
网页的描述,在搜索引擎中搜索网站时,标题下面的一段文字,就是网页的描述内容。


HTML标签,分为“块级标签”和“行级标签”。
【块级标签和行级标签的区别】
1、块级标签自动换行,前后隔一行;行级标签不会自动换行,从左往右一次显示;
2、块级标签的宽度默认是百分之百,行级标签的宽度由文字内容撑开;
3、块级标签可以设置宽度、高度、边距等属性,行级标签不能设置上述属性。
从写法上,HTML标签分为“成对标签”和“自闭合标签(空标签)”
成对标签:成对出现,有开始标签,必须有结束标签,内容包裹在两个标签之间。
例如:<h1></h1> <p></p> <title></title>
自闭合标签/空标签:只有一个标签,用/表示标签的自动闭合(/可以省略)。
例如<hr /><link /><meta />
2、<h>标签
h标签:标题标签,默认加粗,数字越小标题越大


水平线标签
4、<br />标签
换行标签,在代码中敲回车,在网页中并没有作用。必须使用<br>断行。
5、<p>标签

6、<blockquote>标签
7、<pre>标签
预格式标签
显示效果如图:
五、基本行级/块级标签
常用的行级标签
1.span标签
2.[em/i/b 区别]
2)em和strong都有强调的作用,但是em是倾斜,strong是加粗。而且,strong的强调程度要比em更高。

3.常用的引用标签
区别:
① 显示效果上: blockquote整段缩进、q加引号、cite 倾斜
② 从功能上: blockquote用于引用一整段内容,是块级标签。 q用于引用一句话,是行级标签。 cite常用于引用作品名、书画名。

4.small标签和big标签
5.img标签
[路径的表示方式]
① 网络图片地址。 并不建议使用。
② 可以使用图片的绝对路径。但是,严禁使用绝对路径。 因为,绝对路径使用file://协议,网页使用http://协议打开无法访问file://协议的文件。
file:///C:/sunyang.jpg -- 绝对路径写法:file:///盘符:/文件路径
③ 使用相对路径。 推荐使用的唯一方式。
a. 图片在当前文件的下一层, “文件夹名/图片名”
b. 图片与当前文件在同一层,直接写"图片名"
c. 图片在当前文件的上已成,"../图片名" 。
注意: 图片必须包含在项目里面,不能退出项目根目录
2). width、height 宽度、高度属性
3). title:鼠标指上时显示的文字
4). alt: 图片无法加载时,显示的文字。 省略alt,将默认显示title内容
5). align: 图片周围的文字,相对于图片的排列方式;
top 文字居上 center 文字居中 bottom 文字局底
6.a标签
1)超链接
2)功能性链接
6.其他的一些行级标签(不重要,了解即可)
块级标签
1.h标签、hr标签、p标签、blockquote标签、pre标签(前面已说过)
2.列表
1)有序列表
2)无序列表
3)定义列表
3.组合标签figure
4.div标签
HTML5基本标签的更多相关文章
- HTML5 <details> 标签
HTML5 中新增的<details>标签允许用户创建一个可展开折叠的元件,让一段文字或标题包含一些隐藏的信息. 用法 一般情况下,details用来对显示在页面的内容做进一步骤解释.其展 ...
- JavaScript----Js操控-HTML5 <progress> 标签
Js操控----HTML5 <progress> 标签 简单模拟下下载进度跑条 <h4>加载进度</h4> <input type="button& ...
- HTML5新标签 w3c
w3c标准下的HTML5新标签 ,做个归纳总结: H5标签 定义和用法 兼容性 <artical> 规定独立的自包含内容, 支持html中的全局属性, 支持html中的事件属性 IE: 支 ...
- HTML语义化:HTML5新标签——template
一.前言 当我们使用String-base的模板引擎(如Handlebars.js等)时,要么就通过外部文件存放模板文本,需要时再通过XHR或script标签加载进来:要么通过<script t ...
- 让ie浏览器支持html5新标签的解决方法(使用html5shiv)
没估计错的话旧版浏览器都是不识别这些新增的标签所以都是用行内元素来处理解决的,所以,有一个解决办法的突破口就是让它变成块状元素就不会处于同一行了,这样在新旧浏览器都是可以显示同样的效果,再者就是让浏览 ...
- html5有哪些新特性、移除了那些元素?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和 HTML5?
* HTML5 现在已经不是 SGML(标准通用标记语言,是一种定义电子文档结构和描述其内容的国际标准语言) 的子集,主要是关于图像,位置,存储,多任务等功能的增加. * 拖拽释放(Drag an ...
- HTML5 <a>标签的ping属性用法
随着移动互联网用户井喷式的增长,web前端开发中的HTML5在近几年备受瞩目,越来越多的人从事html5开发相关工作.今天小编也来凑个热闹,和大家一起来谈谈HTML5中<a>标签的ping ...
- HTML5视频标签video
现阶段,我们要在网页中嵌入视频的最可靠最常用的办法是使用Flash,通过使用<object>和<embed>标签,就可以通过浏览器播放swf,flv等格式视频文件,但是前提是浏 ...
- Html5新标签解释及用法
Html5新标签解释及用法 HTML 5 是一个新的网络标准,目标在于取代现有的 HTML 4.01, XHTML 1.0 and DOM Level 2 HTML 标准.它希望能够减少浏览器对于需要 ...
- Html5新标签及用法
HTML 5 是一个新的网络标准,目标在于取代现有的 HTML 4.01, XHTML 1.0 and DOM Level 2 HTML 标准.它希望能够减少浏览器对于需要插件的丰富性网络应用服务( ...
随机推荐
- Azure MySQL PaaS (3) 创建MySQL异地只读数据库 (Master-Slave)
<Windows Azure Platform 系列文章目录> Azure MySQL PaaS服务提供异地只读的功能,我们可以在主站点,比如Azure上海数据中心,创建MySQL主节点. ...
- Java虚拟机-----------Java内存区域与内存溢出异常
Java内存区域划分 Java虚拟机运行时的数据区大致可划分为五部分:方法区,堆(两部分组成Java堆内存),虚拟机栈,本地方法栈(Java栈内存),程序计数器. 1.程序计数器 程序计数器占较小的内 ...
- 学习java 的经验
一.学习java首先应该对他有个全局的看法 ,他由几部分组成 1.java 的基础语法 2.使用Swing 来做桌面应用,可做嵌入式开发. 3.JDBC数据库的链接 4.网络编程,主要是socket编 ...
- Watson API - Personality Insight For Certificate
Personality Insight For Certificate 1.Describe the intended use of the Personality Insights service ...
- Android系统--输入系统(十四)Dispatcher线程情景分析_dispatch前处理
Android系统--输入系统(十四)Dispatcher线程情景分析_dispatch前处理 1. 回顾 我们知道Android输入系统是Reader线程通过驱动程序得到上报的输入事件,还要经过处理 ...
- Java并发包基石-AQS详解
目录 1 基本实现原理 1.1 如何使用 1.2 设计思想 2 自定义同步器 2.1 同步器代码实现 2.2 同步器代码测试 3 源码分析 3.1 Node结点 3.2 独占式 3.3 共享式 4 总 ...
- UWP中使用Composition API实现吸顶(1)
前几天需要在UWP中实现吸顶,就在网上找了一些文章: 吸顶大法 -- UWP中的工具栏吸顶的实现方式之一 在UWP中页面滑动导航栏置顶 发现前人的实现方式大多是控制ListViewBase的Heade ...
- oracle高级查询(实例基于scott用户四张表)
oracle高级查询(实例基于scott用户四张表) 分组查询 多表查询 子查询 综合实例 ====================================================== ...
- Angular4 组件通讯方法大全
组件通讯,意在不同的指令和组件之间共享信息.如何在两个多个组件之间共享信息呢. 最近在项目上,组件跟组件之间可能是父子关系,兄弟关系,爷孙关系都有.....我也找找了很多关于组件之间通讯的方法,不同的 ...
- 机器学习(4)Hoeffding Inequality--界定概率边界
问题 假设空间的样本复杂度(sample complexity):随着问题规模的增长导致所需训练样本的增长称为sample complexity. 实际情况中,最有可能限制学习器成功的因素是训练数据的 ...