HTML语言又称为超文本标记语言;HTML语言是用来描述网页的一种语言,HTML语言不是一种编程语言,而是一种标记语言;既然HTML是标记语言,那么HTML由一套标记标签组成,在制作网页时,HTML使用标记标签来描述网页。
1、世界知名浏览器厂商对HTML5的支持;例如:Internet Explorer 、Google、Firefox 、Safari、Opera等主要的Web浏览器都是支持的。
2、市场的需求
3、跨平台
万维网联盟(World Wide Web Consortium ,W3C)是Web技术领域最权威和具有影响力的国际中立性技术标准结构;W3C标准的诞生确保多个浏览器都兼容,HTML内容结构都是语义化的。
W3C标准不是某一个标准,而是一系列的标准集合,一个网页主要由三个部分组成:结构、表现和行为。
W3C标准包括结构化标准语言(HTML、XML)、表现标准语言(CSS)、行为标准(DOM、ECMAScript)。
HTML5最基本的语法就是<标记>内容标记>
标记在有的地方也称为标签或元素,标签都是成对出现的,有开始标记也有对应的结束标记,以"<>“开始,以”>"结束,要求成对出现;标签之间要有缩进,体现出层次感,以方便阅读程序和修改程序;
<html>
<head>
<title>这是头部名称title>
head>
<body>
这是主体部分
body>
html>
HTML5的基本结构分为两个部分:头部部分(head)和主体部分(body);头部部分包括网页标题(title)等信息;主体部分包括网页内容信息。
1、DOCTYPE声明
DOCTYPE是用来声明文档类型的声明,是用来告诉浏览器用哪种规范来解释这文档中的代码的;DOCTYPE语句必须在文档的第一行。HTML5文档中可以不使用DOCTYPE,浏览器也可以勉强识别;但是建议要有DOCTYPE语句。
2、
标题标签
3、
<mate charset="UTF-8"/>
1、gb3212:简体中文
2、IOS—885901:纯英文
3、big5:繁体
4、UTF-8:国际性通用的字符编码
注意:在保存文件时编码方式一定要和HTML5页面中的
标题标签使用来表示一段文字的标题或主题,支持多层次的内容结构
标题标签的语法是:
<h1>这是一级标题 h1>
<h2>这是二级标题h2>
<h3>这是三级标题h3>
<h4>这是四级标题h4>
<h5>这是五级标题h5>
<h6>这是六级标题h6>
在HTML5中提供了上面六种标题标签,其中
段落标签的语法:
这是一个段落标签
这也是一个段落标签
我是一个人才
标签用来表示一个段落,一个段落中可以包含多行文字,文字内容将随浏览器窗口的大小自动换行。
换行标签语法:
这个组员有点难搞哦
就算是个人才也搞不定啊
换行标签< br/> 表示的是强制换行,这个标签有点特殊,没有结束标签,直接使用标签表示开始和结束;
注意:这种标签也叫单标签;有开始和结束标签的叫双标签。
水平线的语法:
<p>
人才
p>
<hr/>
<p>
个个是人才<br/>
好好学习<br/>
天天向上<br/>
p>
水平线标签和换行标签一样的特殊,水平线标签也是单标签。
加粗语法:
<strong>我是最棒的strong>
标签可以让字体变粗;还是一个带有语义化的标签,有强调、加强语气的作用。
倾斜语法:
<em>好好学习em>
标签可以让字体倾斜。
注释的语法:
注释就是用来 解释文档的,当浏览器遇到注释的时候会自动忽略注释内容。
特殊符号表
特殊字符 | 字符实体 |
---|---|
空格 |  ; |
大于号(>) | >; |
小于号(<) | <; |
引号(") | "; |
版权符号(©) | ©; |
1、常见的图像格式:JPG格式、GIF格式、BMP格式、PNG格式
2、图片标签的基本语法:
<img src="图片地址" alt="图片的替代文字" title="鼠标悬停提示文字" width="图片宽度" height="图片高度"/>
是图片标签;src属性表示图片路径; alt属性指定的替代文本,在图片无法显示的时候,替代显示的文本;title属性可以提供额外的提示或帮助信息,当鼠标放在图片上时显示提示信息;width属性和height属性分别表示宽度和高度,如果要改变图片原始的大小,就可以用width属性和height属性设置。
1、超链接的基本语法:
链接文本或图片
href:表示链接地址的路径;当超链接路径为"#"时,表示空链接。
target:指定链接在哪个窗口打开,常用的取值有 _self(自身窗口) , _blank(新建窗口)。
2、路径
相对路径:相对于当前页面的路径,一般指向本站点的文件,所以一般不需要一个完整的url地址的形式。
绝对路径:指向目标地址完整描述,一般指向本站点外的文件。绝对路径是从盘符出发的。
相对路径中可能会用到的特殊符号:" …/ “表示当前目录的上一级目录,” …/…/ "表示当前目录的上上级目录。
3、页面间链接
页面间链接就从一个页面链接到另一个页面。
4、锚链接
语法:
<a name="marker">目标位置乙a>
name为 标签的属性,marker为标记名;注:如果没有name属性可以用id属性来做标记,效果是一样的,但是兼容性更好。
当前位置甲
设置甲位置链接路径href属性值为"#标记名"。
5、功能性链接
功能性链接比较特殊,当单击该链接时不是打开某个网页,而是启动本机自带的某个应用程序。
块元素特性:无论内容多少,该元素独占一行。
行内元素特性:内容撑开宽度,左右都是行内元素的可以排在一起。
列表是信息资源的一种展示形式。列表分为三种类型:无序列表、有序列表、定义列表;
语法:
<ul>
<li>第一项li>
<li>第二项li>
<li>第三项li>
ul>
无序列表由
注意:
1、
2、
无序列表的特征:
1、没有顺序,每个
2、默认的
3、一般用于无序类型的列表。
语法:
<ol>
<li>第一项li>
<li>第二项li>
<li>第三项li>
ol>
有序列表用
有序列表的特征:
1、有顺序,每个
2、默认< li>标签项前面有顺序标记。
3、一般用于排序类型的列表。
语法:
- 标题一
- 第一项
- 第二项
- 标题二
- 第一项
- 第二项
定义列表是标题及列表项的结合,定义列表是用
定义列表的特性:
1、没有顺序,每个
2、没有默认标记。
3、一般用于一个标题下有一个或多个列表项的情况。
1、无序列表中的每一项都是平级的,没有级别之分;有序列表会依据列表项的顺序来进行显示。
2、在实际的网页应用中,无序列表比有序列表应用更广泛。
3、定义列表一般适用于带标题和标题解释性内容的场合。
基本结构:
1、单元格:单元格是表格的最小单位,一个或多个单元格纵横排列组成了表格
2、行:一个或多个的单元格横向堆叠形成了行
3、列:因为表格单元格的宽度必须一致,所以单元格纵向排列形成了列
基本语法:
<table>
<tr>
<th>第一个单元格的内容th>
<th>第二个单元格的内容th>
tr>
<tr>
<td>第一个单元格的内容td>
<td>第二个单元格的内容td>
tr>
table>
使用
来创建表格标题,在 | ||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
来创建单元格,可以有多个单元格; | 和 | 是同级。
实例:
五、iframe框架1、使用语法:
四、表单一、表单概述1、表单的属性和标签在HTML5中,用 |