![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
天蓬老师Correction status：qualified
Teacher's comments：精辟,很好
Collection
Collection
<!-- 声明文档类型 --><!DOCTYPE html><!-- 指定语言 `zh-CN`定义语言为中文 --><html lang="en"><head><!-- 字符集 --><meta charset="UTF-8"><!-- 使用最高版本ie渲染 --><meta http-equiv="X-UA-Compatible" content="IE=edge"><!--设置视口：可视窗口width=device-width 窗口宽度等于设备宽度initial-scale=1.0 页面初始化按照1:1原样显示--><meta name="viewport" content="width=device-width, initial-scale=1.0"><!-- 网站标题 --><title>Document</title></head><body></body></html>
<head><meta charset="utf-8"><title></title><!--指定默认地址或者所有链接的目标地址_blank 新窗口中打开 _self 自身窗口打开--><base href="https://www.baidu.com" target="_blank" /></head><body><h1> 标题文本 </h1><p> 段落文本内容 </p><div> 大盒子 </div><span> 小盒子 </span><b> 加粗 </b> <strong></strong><i> 斜体 </i> <em></em><s> 删除线 </s> <delect><</delect><u> 下划线 </u> <ins></ins><img src="images/mess.jpg" width="300" height="300" border="3" title="这是提示文本" /><img src="cz.jpg" width="300" height="300" border="3" alt="这是图片不存在的替换文本" /><br /> 换行<hr /> 水平线<a href="#">回到顶部<a href="javascript:;">阻止跳转<!-- 锚点定位:1. 使用相应的id名标注跳转目标的位置。 (找目标)2. 使用<a href="#id名">链接文本</a>创建链接文本（被点击的）--><h3 id="two">锚点跳转到此处</h3><a href="#two"><pre>预格式化文本标签:按照我们预先写好的文字格式来显示页面，保留空格和换行等。后台用的多。</pre><!-- 空格号 --> <!-- 大于号 --> <<!-- 小于号 --> ></body>
<a href="https://www.runoob.com" target="taobao">淘宝</a><iframe src="https://www.runoob.com" srcdoc="<i>规定页面中的 HTML 内容显示在 <iframe> 中<i>" width="500" height="500" frameborder="1" name="taobao"><p>H5 不支持 frameborder。规定是否显示 iframe 周围的边框。1/0</p></iframe><button onclick="taobao.location='https://www.runoob.com'">打开淘宝</button>
重点记住： cellspacing（单元格间距） 、 cellpadding（单元格边距）。
<table width="500" border="1" align="center" cellspacing="0" cellpadding="0"><tr><th>姓名</th><th>性别</th><th>电话</th></tr><tr><td>小王</td><td>女</td><td>110</td></tr><tr><td>小明</td><td>男</td><td>120</td></tr></table>
<table><caption>我是表格标题</caption></table>
注意：
跨行合并：rowspan=”合并单元格的个数”
跨列合并：colspan=”合并单元格的个数”
合并的顺序我按照 先上 后下 先左 后右 的顺序
1- 先确定是跨行还是跨列合并
2- 根据 先上 后下 先左 后右的原则找到目标单元格 然后写上 合并方式 还有 要合并的单元格数量 比如 ： <td colspan="3"> </td>
3- 删除多余的单元格 单元格
| 标签名 | 定义 | 说明 |
|---|---|---|
<table></table> |
表格标签 | 就是一个四方的盒子 |
<tr></tr> |
表格行标签 | 行标签要再table标签内部才有意义 |
<td></td> |
单元格标签 | 单元格标签是个容器级元素，可以放任何东西 |
<th></th> |
表头单元格标签 | 它还是一个单元格，但是里面的文字会居中且加粗 |
<caption></caption> |
表格标题标签 | 表格的标题，跟着表格一起走，和表格居中对齐 |
| clospan 和 rowspan | 合并属性 | 用来合并单元格的 |
<thead></thead>：用于定义表格的头部。用来放标题之类的东西。<thead> 内部必须拥有 <tr> 标签！<tbody></tbody>：用于定义表格的主体。放数据本体 。<tfoot></tfoot>：放表格的脚注之类。
<!--定义列表常用于对术语或名词进行解释和描述，定义列表的列表项前没有任何项目符号。--><dl><dt>名词1</dt><dd>名词1解释1</dd><dd>名词1解释2</dd>...</dl>
| 标签名 | 定义 | 说明 |
|---|---|---|
| <ul></ul> | 无序列表 | 里面只能包含 li 没有顺序，我们以后布局中最常用的列表 |
| <ol></ol> | 有序列表 | 里面只能包含 li 有顺序， 使用情况较少 |
| <dl></dl> | 自定义列表 | 里面有2个兄弟， dt 和 dd |
