HTML学习
HTML 是一门语言，所有的网页都是有HTML这门语言编写出来的。
HTML(HyperText Markup Language)：超文本标记语言
- 超文本：超越了文本的限制，比普通文本更强大。除了文字信息，还可以定义图片、音频、视频等内容。
- 标记语言：由标签构成的语言。
HTML运行在浏览器上，HTML标签由浏览器来解析。
HTML标签都是预定义好的。例如：使用来展示图片。
W3C标准：网页主要有三部分组成
- 结构：HTML
- 表现：CSS
- 行为：JavaScript
HTML快速入门
html 快速入门 乾坤未定，你我皆是黑马~
-
HTML 文件以.htm或.html为扩展名
-
HTML 结构标签
标签 描述 定义HTML文档 定义关于文档的信息 </td><td>定义文档的标题</td></tr><tr><td><body></td><td>定义文档的主体</td></tr></tbody></table></li><li> <p>HTML 标签不区分大小写</p> <p>如上案例中的 font 写成 Font 也是一样可以展示出对应的效果的。</p> </li><li> <p>HTML 标签属性值 单双引皆可</p> <p>如上案例中的color属性值使用双引号也是可以的。</p> </li><li> <p>HTML 语法松散</p> <p>比如 font 标签不加结束标签也是可以展示出效果的。但是建议在写的时候还是不要这样做，严格按照要求去写。</p> </li></ul> <h2>基础标签</h2> <table><thead><tr><th>标签</th><th>描述</th></tr></thead><tbody><tr><td><h1> - <h6></td><td>定义标题，h1最大，h6最小</td></tr><tr><td><font></td><td>定义文本的字体、字体尺寸、字体颜色</td></tr><tr><td><b></td><td>定义粗体文本</td></tr><tr><td><i></td><td>定义斜体文本</td></tr><tr><td><u></td><td>定义文本下划线</td></tr><tr><td><center></td><td>定义文本居中</td></tr><tr><td><p></td><td>定义段落</td></tr><tr><td><br></td><td>定义换行</td></tr><tr><td><hr></td><td>定义水平线</td></tr></tbody></table> <p>font：字体标签</p> <ul><li> <p>face 属性：用来设置字体。如 “楷体”、"宋体"等</p> </li><li> <p>color 属性：设置文字颜色。颜色有三种表示方式</p> <ul><li> <p>英文单词：red,pink,blue…</p> <p>这种方式表示的颜色特别有限，所以一般不用。</p> </li><li> <p>rgb(值1,值2,值3)：值的取值范围：0~255</p> <p>此种方式也就是三原色（红绿蓝）设置方式。 例如： rgb(255,0,0)。</p> <p>这种书写起来比较麻烦，一般不用。</p> </li><li> <p>#值1值2值3：值的范围：00~FF</p> <p>这种方式是rgb方式的简化写法，以后基本都用此方式。</p> <p>值1表示红色的范围，值2表示绿色的范围，值3表示蓝色范围。例如： #ff0000</p> </li></ul> </li><li> <p>size 属性：设置文字大小</p> </li></ul> <p><strong>font 标签已经不建议使用了，以后如果要改变文字字体，大小，颜色可以使用 CSS 进行设置。</strong></p> <pre><code class="prism language-html"><!--html 5的标签--> <!DOCTYPE html> <html lang="en"> <head><!--页面的字符集--><meta charset="UTF-8"><title>标题 标题 h1
标题 h2
标题 h3
标题 h4
标题 h5
标题 h6
定义文本的字体、字体尺寸、字体颜色HTML 是一门语言，所有的网页都是有HTML这门语言编写出来的。
HTML 是一门语言，所有的网页都是有HTML这门语言编写出来的。
HTML 是一门语言，所有的网页都是有HTML这门语言编写出来的。
超文本标记语言
HTML 是一门语言，所有的网页都是有HTML这门语言编写出来的。
超文本标记语言
超文本标记语言
超文本标记语言
超文本标记语言 有些特殊字符需要用转义字符。
HTML 原代码 显示结果 描述 <； < 小于号或显示标记 >； > 大于号或显示标记 &； & 可用于显示其他特殊字符 "； " 引号 ®； ® 已注册 ©； © 版权 &trade； ™ 商标 ； 不断行的空白 为了显示，表格中用的为中文分号，实际中要用英文的。
图片、音频、视频标签
标签 描述 定义图片 定义音频 定义视频 img：定义图片
- src：规定显示图像的 URL（统一资源定位符）
- height：定义图像的高度
- width：定义图像的宽度
audio：定义音频。支持的音频格式：MP3、WAV、OGG
- src：规定音频的 URL
- controls：显示播放控件
video：定义视频。支持的音频格式：MP4, WebM、OGG
- src：规定视频的 URL
- controls：显示播放控件
尺寸单位：
height属性和width属性有两种设置方式：
- 像素：单位是px
- 百分比。占父标签的百分比。例如宽度设置为 50%，意思就是占它的父标签宽度的一般（50%）
资源路径：
图片，音频，视频标签都有src属性，而src是用来指定对应的图片，音频，视频文件的路径。此处的图片，音频，视频就称为资源。资源路径有如下两种设置方式：
-
绝对路径：完整路径
这里的绝对路径是网络中的绝对路径。 格式为： 协议://ip地址:端口号/资源名称。
如：
这里src属性的值就是网络中的绝对路径。
-
相对路径：相对位置关系
找页面和其他资源的相对路径。
./ 表示当前路径
…/ 表示上一级路径
…/…/ 表示上两级路径
Title 超链接标签
当我们点击超链接时会跳转到其他的页面或者资源。而超链接使用的是 a 标签。
标签 描述 定义超链接，用于链接到另一个资源 a 标签属性：
- href：指定访问资源的URL
- target：指定打开资源的方式
- _self：默认值，在当前页面打开
- _blank：在空白页面打开
Title 博客 博客列表标签
标签 描述 定义有序列表 定义无序列表 定义列表项 有序列表中的 type 属性用来指定标记的标号的类型（数字、字母、罗马数字等）
无序列表中的 type 属性用来指定标记的形状 ，不建议使用
Title - 苹果
- 香蕉
- 西瓜
- 苹果
- 香蕉
- 西瓜
表格标签
标签 描述 定义表格 定义行 定义单元格 定义表头单元格 table ：定义表格
- border：规定表格边框的宽度
- width ：规定表格的宽度
- cellspacing：规定单元格之间的空白
tr ：定义行
- align：定义表格行的内容对齐方式
td ：定义单元格
- rowspan:规定单元格可横跨的行数
- colspan:规定单元格可横跨的列数
th：定义表头单元格
Title 序号 内容 图片 1 内容1 2 内容2 序号+内容 图片 1 内容1 内容2 3 内容3 布局标签
标签 描述 定义HTML文档中的一个区域部分，经常与CSS一起使用，用来布局网页 用来组合行内元素 两个标签，一般都是和css结合到一块使用来实现页面的布局 。
div 标签 在浏览器上会有换行的效果，而 span 标签在浏览器上没有换行效果。
Title 我是div我是div我是span我是span运行结果如下：
我是div 我是div 我是span 我是span表单标签
登录页面、注册页面等都是表单。
表单：在网页中主要负责数据采集功能，使用标签定义表单
表单项(元素)：不同类型的 input 元素、下拉列表、文本域等
标签 描述 定义表单 定义表单项，通过type属性控制输入形式 为表单项定义标注 定义下拉列表 定义下拉列表的列表项