HTML是超文本标记语言（HyperText Markup Language）的缩写，是一种用于创建网页的标准标记语言。而CSS则是对网页进行下一步的美化，两者相辅相成，才能创建一个完美的网页。
对于有一定编程基础的人来说，这门语言相对简单，但是其中知识点繁多，有人望而却步；有人学过也已经忘得差不多了。希望接下来的系列文章能够帮助你更好了解HTML和CSS或者巩固已学知识
目录
此篇文章到此结束,大家自己也试着找个网页练练手吧！代码无情，人间有情，欢迎大家点赞评论加收藏。内容如有问题还请大家在评论区指点一二。
1.标签语法
HTML通过各种标签标记语言，实现不同功能。
（1）双标签：开头结尾成对出现，且后者比前面多加“/”，<开始标签>内容<结束标签>。eg：
<strong>加粗</strong>ps：对文字内容施行标签所代表的功能
（2）单标签：只有开头无结尾。eg：
<br>换行
<hr>水平线2.结构骨架——！+enter自动生成
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html><html>整个网页</html>
<head>头（存给浏览器）</head>
<title>标题</title>
<body>主体</body>3.关系
- 父子关系（非对齐）：Tab——空格。eg：上图中head和title的关系
- 兄弟关系（对齐）：Shift Tab——取消空格。eg：上图中head和body的关系
4.注释
<!-- 注释内容 -->快捷键：Ctrl+/——删除/添加
5.标题
<h1>标题一</h1>
<h2>标题二</h2>
<h3>标题三</h3>
<h4>标题四</h4>
<h5>标题五</h5>
<h6>标题六</h6>6.段落标签
<p>段落</p>7.文本格式化
| strong | 加粗 | b |
| em | 倾斜 | i |
| ins | 下划线 | u |
| del | 删除线 | s |
8.图像
<img src="图片的URTL" alt="替换文本（图片无法显示则显示文字）" title="提示文本（鼠标悬停时显文字）">属性值：height/weight：图片大小
9.路径——起->终路线（相对/绝对）
（1）相对
- /：表示某个文件夹内
- ./：表示当前文件夹内
- ../：表示上一个文件夹内
（2）绝对
- 自己电脑：上述方法复制地址
- 别人：复制图片地址
10.超链接
<a href="链接地址"></a>
<a href="#" target="_blank">文字内容</a>
<!-- #：空链接target="_blank":自动生成新建页 -->11.音频
<audio src="音频的UTRL"></audio>| 属性值 | 效果 |
| controls | 显示面板 |
| loop | 循环 |
| autoplay | 自动 |
12.视频
<video src="视频的URTL"></video>| 属性值 | 效果 |
| controls | 显示面板 |
| loop | 循环 |
| muted | 静音 |
| autoplay（muted前提下） | 自动 |
13.列表
- 无序（文章当前部分即为无序效果）
<ul>
<li>···</li>
<li>···</li>
</ul>- 有序
<ol>
<li><a href="#">kbkj</a></li>
<li><a href="#">xnx</a></li>
</ol>- 定义
<dl>
<dt>标题</dt>
<dd>内容</dd>
</dl>14.表格
<table border="1">
<!-- border="1"是框的边距，可以去掉 -->
<tr>
<th>表头</th>
</tr>
<!-- 第一行 -->
<tr>
<td>张三</td>
</tr>
<!-- 第二行 -->
<tr>
...
</tr>
<!-- 第三行 -->
</table>优化方法
-
thead：头
-
tbody：内容
- tfoot：尾
15.合并单元格
| 属性 | 效果 |
| rowspan | 垂直合并 |
| colspan | 水平合并 |
ps：以上均为<td>标签的属性，如下例子：
<table border="1">
<tr>
<td colspan="2" rowspan="2">合并的单元格</td>
<td>单元格</td>
<td>单元格</td>
</tr>
<tr>
<!-- 这里的单元格因为上面的rowspan和colspan被合并，所以不会显示 -->
</tr>
<tr>
<td>单元格</td>
<td>单元格</td>
<td>单元格</td>
</tr>
</table>16.表单
（1）input标签
<input type="属性值">| 属性值 | 效果 |
| text | 文本 |
| passward | 密码 |
| radio | 单选 |
| checkbox | 多选 |
| file | 文件上传 |
（2）占位文本——提示
<input type="属性值" placeholder="提示">（3）单选框：radio
name：分组（同组只选一个）
ps：默认选一个时，在此选择中属性加checked，多选同理
（4）file中文件多选
<input type="file" multiple>17.下拉菜单
<select>
<option>内容</option>
<option>内容</option>
<option selected>内容</option>
</select>
<!--selected:默认选中 -->场景：注册界面选取自己所在城市
18.文本域——形成文本框
<textarea>···</textarea>19.label（包裹内容，该内容也可以被选择）
<label><input type="radio" name="gender">男</label>属性值和input相同
20.按钮
<button type="属性值">文字内容</button>| 20属性值 | 效果 |
| submit | 提交 |
| reset | 重置 |
| button | 普通按钮 |
拓展
div：换一行
<div>...</div>
span：不换行，空一格
<span>...</span>
空格: 
<:<
>:>
2461
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
