HTML基础
1 什么是标记语言
文本文件（txt）：只保留文字内容，不保留文本格式。
word中：即可以保存文字内容，又可以保留文字格式。
比如：在.txt文件中和在word文件中输入同样的内容，设置同样的格式，全部发送到另一台计算机上时，出现了.txt文件只有文字内容没有格式，而word保留了内容和格式。
Word文档就是标记语言的一种，而现在要学习的HTML(HyperTextMarkup Language)也是一种标记语言，叫做超文本标记语言。
超文本标记语言：不光可以保存文字信息，还可以保存音频、视频等内容。
在我们浏览网页时，其实是将储存在服务器上的HTML文件下载到本地，在通过浏览器进行解析，从而呈现了网页内容。
2 HTML的基本结构
<html >
<head>
<meta charset="UTF-8">//设置字符集
<title>Title</title>//设置标题
</head>
<body>
1803班第一次HTML课程
</body>
</html>
HTML的基本结构包括三大部分：<html>标签：是整个目录的跟节点，包括了两个字节点。
<head>标签：主要设置一些写代码时需要做的设置工作，比如字符集、标题。
<body>标签：文档的主体部分，页面中要呈现的内容
3 HTML的基础标签
3.1标题标签
常用的标题有<h1>-------<h6>;用于显示页面的标题，包含了标题的格式。消息内容。
3.2 段落标签
<body>
<h3>静夜思</h3>
<p>床前明月光</p>
<p>疑是地上霜</p>
<p>举头望明月</p>
<p>低头思故乡</p>
</body>
3.3 链接标签
<a>标签，作用就是页面跳转，包括页内跳转和页间跳转。
href属性：链接的目标地址。
target属性：控制页面跳转方式其取值有四个：
_blank;在新的页面打开。
_self;在当前页面打开（默认的打开方式）。
_top;
_parent;
<body>
<a href="https://www.baidu.com/"target="_blank">跳转到百度</a>
</body>
2.页内跳转
要给“目的地”设置一个id，在<a>标签中的href属性里面使用“#....(id名字)”实现页内跳转。
Id属性具用唯一性，是页面元素中的唯一标识。id名不能重复。
3.4 图片标签
<img>图片标签：在网页中插入图片
<body>
<img src="../C203_01_04链接标签/下载%20(1).jpg" alt="">
<img src="https://tse3-mm.cn.bing.net/th?id=OIP.TOVpDQpFEQhqOGw3CbL3CwHaEK&w=300&h=300&p=0&o=5&pid=1.7"alt="">
</body>
图片可以从本地载入，也可以从网页中载入，本地载入时要找到图片的地址，在网页载入时要找到图片的网络地址。
路径：
相对路径：../：上一级目录，/:下一级目录，.:同级目录，这个“.”可以省略
绝对路径:
3.5 列表
列表在word中：
无序列表：
有序列表：
有序列表
无序列表在html中:
<ul>标签定义一个无序列表
<li>标签定义一个列表项
type属性：指定了无序列表的符号，取值有：
disc：实心圆（默认符号）
circle：空心圆
square：实心正方形
<body>
<ul>
<li type="disc">牛奶</li>
<li>面包</li>
<li>油条</li>
<li>鸡蛋</li>
<li>豆浆</li>
</ul>
</body>
结果：
有序列表在html中：
<ol>标签定义一个有序列表
type属性：制定了列表符号的种类包括：
1、2、3、4、5……
a、b、c、d、e……
还有一些其他的种类。
start属性：指定列表开始的位置，也就是从第几个开始，而不是从第几开始。
<body>
<ol type="a" start="2">
<li>牛奶</li>
<li>面包</li>
<li>油条</li>
<li>鸡蛋</li>
<li>豆浆</li>
</ol>
</body>
结果：
自定义列表在html中：
<dl>标签定义一个自定义列表
<dt>标签列表的标题
<dd>标签列表的描述
<body>
<dl>
<h3>中国各省份</h3>
<dt>河南</dt>
<dd>古都洛阳，省会郑州，我的老家周口</dd>
<dt>浙江</dt>
<dd>对浙江的描述</dd>
</dl>
</body>
4表单
4.1 表单
什么是表单？表单就是收集填写完信息后提交到后台服务器。
<form>标签定义一个表单
get提交和post提交
定义一个密码输入框：
<input type="password" name="password"size="12">
Label的作用：可以对其单独进行样式设置，同for属性可以和某一个input标签进行关联；
<labelfor="user">账号：</label>
单选框：
Checked默认选中
<input type="radio" name="role" value="1"checked>
多选框：
<input type="checkbox" value="1">音乐
普通按钮：
<button></button>
文件选择框：
<input type="file">选择文件
下拉列表：
<body>
<select name=”car”>
<option>奥迪</option>
<option>奥迪</option>
<option>奥迪</option>
<option>奥迪</option>
<option>奥迪</option>
<option>奥迪</option>
<option>奥迪</option>
</select>
</body>
文本框：
<textareaname="info"rows="35"cols="7">
</textarea>
8444
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
