HTML（1）

web的三大标准

1. 结构：用于对网页元素进行整理和分类，主要是HTML
2. 表现：用于设置网页元素的版式、颜色、大小等外部样式，主要是CSS
3. 行为：是指网页模型的定义交互的编写，主要是Javascript

HTML初识

1. HTML指的是超文本文件标记语言（Hyper Text Markup Language）是用来描述网页的一种语言
2. HTML不是一种编程语言，而是一种标记语言（markup language）
3. 标记语言是一套标记标签

总结：网页是由网页元素组成，这些元素是利用html标签描述出来的，然后通过浏览器解析，就可以显示给用户了

超文本

1. 因为它可以加入图片、声音、动画、多媒体等内容（超越文本的限制）
2. 不仅如此，它还可以从一个文本跳转到另一个文本，与世界各地主机的文件连接（超级链接文本）

HTML骨架

简单的骨架格式

HTML骨架标签总结

标签	定义	说明
< html >< /html >	HTML标签	页面中最大的标签，我们称为 根标签
< head >< /head >	文档的头部	注意head标签中我们必须要设置的标签是title
< title >< /title >	文档的标题	让页面拥有一个属于自己的网页标题
< body >< /body >	文档的主体	元素包含文档的所有内容 基本都是放到body里面的

HTML常用标签

首先HTML和CSS是两种完全不同的语言，我们学的是结构，就只写HTML标签，认识标签就可以了，不会再给结构标签指定样式了
HTML标签有很多，这里我们学习的是最为常用的

排版标签

排版标签主要和CSS搭配使用，显示网页结构和标签，是网页布局最常用的标签

标题标签（熟记）

为了使网页更具有语义化，我们经常会再页面中用到标题标签，HTML提供了6个等级的标题
即标题标签语义：
基本语法格式：
< h1>标题文本 < /h1>
< h2>标题文本< /h2>

段落标签（熟记）

< p>段落内容< /p>

水平线标签（认识）

< hr />

换行标签（熟记）

单词缩写：break 打断，换行
< br/>

div和span标签（重点）

div和span是没有语义的，是我们网页布局主要的2个盒子，想必你听过，css+div

div就是division的缩写 分割、分区 的意思，其实有很多div来组合网页
span 跨度、跨距、范围
语法格式：
< div>这是头部< /div>
< span>今日价格< span>
他们两个都是盒子，用来装我们网页的元素的，只不过他们有区别，现在我们主要记住使用方法和特点就好了

1. div标签 用来布局的，但是现在一行只能放一个div
2. span标签 用来布局的，一行上可以放好多个span

文本格式化标签（熟记）

在网页中，有时需要为文字设置粗体、斜体、下划线效果，这时就需要用到HTML中的文本格式化标签，是文字以特殊的方式显示

标签	显示效果
< b>< /b>和< strong>< /strong>	文字以粗体方式显示（XHTML推介使用strong）
< i>< /i>和< em>< /em>	问题以斜体方式显示（XHTML推介使用em）
< s>< /s>和 < del>< /del>	文字以加删除线方式显示（XHTML推介使用del）
< u>< /u>和< ins>< /ins>	文字以加下划线方式显示（XHTML推介使用u）

图像标签

单词缩写：image 图像
语法如下
< img src=“图像URL” />
该语法中src属性用于指定图像文件的路径和文件名，它是img标签的必需属性

border后面我们会用css来做，这里就记住这个broder单词就好
注意：

1. 标签可以拥有多个属性，必须写在开始标签中，位于标签后面
2. 属性之间不分先后顺序，标签名和属性、属性和属性之间均以空格分开

链接标签（重点）

单词缩写：anchor的缩写，基本解释 铁锚
在html中创建超链接非常简单，只需用标签把文字括起来就好了
语法格式：
< a href=“跳转目标” target=“目标窗口的弹出方式”>文本或图像< /a>

1. 外部链接:需要添加href 可以跳转至百度 比如：< a href=“http:www.baidu.com”>百度一下< /a>
2. 内部链接 直接链接内部的网页名称即可 比如：< a href=“html_01.html”>首页< /a>
3. 如果当时没有确定的链接目标时，通常将链接标签的href属性值定义为“#”(即href="#")，表示该链接暂时为一个空链接
4. 不仅可以创建文本超链接，在网页中各种网页元素，如图像、表格、音频、视频等都可以添加超链接

注释标签

< !-- 文本–>
注释是给人看的，目的是为了更好的解释这部分代码是干嘛的，程序是不执行这个代码的
快捷键 ctrl+/

路径

相对路径：

绝对路径：
不提倡使用

1. 电脑中的地址
2. 完整的网络地址