论HTML的学习

本文分享前端学习的小知识，初学者也可以轻松学会~

基本概念

1.HTML

超文本标记语言(英语：HyperText Markup Language,简称HTML)是一种用于创建网页的标准标记语言。
专门用于网页开发的语言，主题要通过HTML标签对网页中的文本、图片、音频、视频等内容进行描述HTML元素是构建网站的基石。
2.标记语言

有无数个标记(标签、tag)组成
是对某些内容进行特殊的标记，以供其他解释器识别处理
比如使用h2标记的文本会被识别为“标题”进行加粗、文字放大显示
由标签和内容组成的称为元素(element)
3.超文本

表示不仅仅可以插入普通的文本（Text），还可以插入图片、音频、视频等内容
还可以表示超链接（HyperLink），从一个网页跳转到另一个网页

1.什么是网页？

网页的专业术语叫做Web Page
打开浏览器查看到的页面，是网络中的一“页”
网页中的内容可以非常丰富：包括文字、链接、图片、音乐、视频等等
2.什么是网站？

网站是由多个网页组成的
通常一个网站由n个网页组成（N>=1）

1.网页组成

阶段一：HTML元素；网页的内容
阶段二：HTML元素+CSS样式；网页的视觉体验
阶段二：HTML元素+CSS样式+JavaScript语言；网页的交互处理

1.建第一个网页

1.在代码文件夹中点击鼠标右击 → 新建文本文档 → 命名为：第一个网页.txt；
2.双击这个文件，输入代码等内容 → 记得保存！
3.双击这个文件，输入代码等内容 → 记得保存！
4.双击这个文件，输入代码等内容 → 记得保存！

1.标签

标签由<、>、/、英文单词或字母组成。并且把标签中<>包括起来的英文单词或字母称为标签名;
常见标签由两部分组成，称之为：双标签。前部分叫开始标签，后部分叫结束标签，两部分之间包裹内容;
少数标签由一部分组成，我们称之为：单标签。自成一体，无法包裹内容;
HTML元素不区分大小写，但是推荐小写。
2.元素

元素是网页的一部分
一个元素可以包含一个数据项，或是一块文本，或是一张照片，亦或是什么也不包含
3.属性
属性包括元素的额外信息，这些信息不会出现在实际的内容中。

一个属性必须包括如下内容

一个空格，在属性和元素名称之间;
如果已经有一个或多个属性，就与前一个属性之间有一个空格;
属性名称，后面跟着一个等于号;
一个属性值，由一对引号“ ”引起来

属性的分类

有些属性是公共的，每一个元素都可以设置，比如class、id、title属性
有些属性是元素特有的，不是每一个元素都可以设置，比如meta元素的charset属性、img元素的alt属性等

1.基本骨架

文档说明： HTML的文档说明，告诉浏览器，以什么样的标准来解析我们的代码
html元素：是一个网页的根元素，只有这一个
head元素：网页的头部，基本上在对网页的设置，都会在head实现
body元素：网页的主要内容都是写在body中的

注意：
 1.我们在以后写代码(html,css,js...)遇到特殊符号,必须都是英文输入下的符号
 2.制作一个网页必须按照html的结构去写.

6.图片标签【img标签】

1.img是image单词的所以，是图像、图像的意思
2.img标签需要展示对应的效果，需要借助标签的属性进行设置
3.img并排显示（人妖标签）

img属性小结

7.图片路径

1.分为绝对路径和相对路径
2.绝对路径是指目录下的绝对位置，可直接到达目标位置，通常从盘符开始的路径，如：D:\DAY01\images\1.jpg
3.相对路径是指从当前文件开始出发找目标文件的过程
8.超链接【a标签】

1.点击超链接之后，可以从一个页面跳转到另一个页面
9.div元素、span元素

1.div标签：一行只显示一个（独占一行）
2.span标签：一行可以显示多个

1.ul、ol、dl

1.列表分类：无序列表、有序列表、自定义列表
2.无序列表中ul表示列表整体，包括li标签，li标签可以包含任意内容，列表的每一项前默认显示原点标识

3.有序列表中ol表示整体，li标签包含任意内容，列表的每一项前默认显示序号标识
4.自定义列表中dl/dd标签,dl/dd标签可以包含任意内容，dd前会默认显示缩进效果

1.表格元素

1.table表示表格，tr表示表格中的行，td表示行中的单元格，thead是表格的表头
2.tbody是表格的主体，tfoot是表格的页脚，caption是表格的标题，th是表格的表头单元格

1.form表单

1.input单行文本输入框、单选框、复选框等元素
2.input元素中的其他属性
1）readonly:只读 2）disabled：禁用 3）checked：默认被选中，只有当type为radio或checkbox时可用 4）autofocus：当页面加载时，自动聚焦 5）name：名字，在提交数据给服务器时，可用于区分数据类型，当前控件的含义，提交之后可以告诉后端发送过去的数据是什么含义，后端接收到数据的格式是：name的属性值 = value的属性值 6）value：取值用户输入的内容，提交之后会发送给后端服务器 3.button元素默认是提交按钮
4.select元素是下拉菜单，option是下拉菜单的每一项
5.textarea文本域，cols可以规定文本域内可见宽度，rows可规定文本域内可见行数
6.label元素是绑定内容与表单标签的关系
7.action属性用于提交表单数据的请求URL