本文共 2511 字，大约阅读时间需要 8 分钟。
一、列表
分为无序列表，有序列表，定义列表
1、无序列表
<ul>
<li></li> <li></li> </ul>- 111
- 222
- 333
- 444
可以注意到的是，无序列表的列表标签类型为小圆点，也可以改成其他的
type的类型
1、disc(默认的，实心圆形)
2、circle（空心圆形）；
3 square（实心正方形）;
在<ul type="">中写表示改变全部li标签的形状，如果想改变单独的一个，则只需在你要改的那个<li type=“”>中添加类型即可
注意如果你想写多个<li></li>，办法也是选中这一行，然后ctrl+D即可，就不用ctrl+c、ctrl+v那么麻烦了
2、有序列表
<ol>
<li></li> <li></li> </ol>
- 111
- 222
- 333
- 444
与无序列表一样，有序列表的类型也可以改变
type：默认为1，变换类型有： a,A,i,I
3、自定义列表
标题靠左对齐。内容则换行向右移动显示
<dl> <dt>标题</dt> <dd>正文内容</dd> </dl>- 标题
- 正文内容正文内容正文内容正文内容正文内容正文内容
这些列表之间是可以进行相互嵌套的，所以可以多加练习
二、表格
<table>
<caption>标题和摘要</caption>
<th>表头</th>
<tr>行</tr>
<td>列</td>
</table>
| 第一列 | 第二列 | 第三列 | 第四列 |
|---|---|---|---|
| 1-1 | 1-2 | 1-3 | 1-4 |
| 2-1 | 2-2 | 2-3 | 2-4 |
注意：th主要对下面的内容起说明作用，需要提前声明（可以不写，caption也可以不写，但tr td必须写）。th的内容会自动加粗和居中显示
这里便是一个最基本的表格样式，可以看到没有什么样式，需要添加样式的话如下，以及效果
border：边框默认为0px
align="right":left center 水平偏移，可以移动表格，一行，单独的一个（默认为left） valign="top":bottom middle 垂直偏移 rowspan=" "：跨行，跨几行写几，注意，如果你写了三行三列的表格，当你想rag第一行第一个跨两行时，一定要把编写的第二行第一个的代码删除掉 colspan=" "：跨列 height=" ":高度 width=" ":宽度cellpadding:单元格文本与边框的距离，是补白，是指单元格内文字与边框的距离
cellspacing:单元格边框间距，两个单元格之间的距离
| 1-1 | 1-2 | b |
| 2-2 | a | |
| 3-1 | 3-2 | |
注意：如果想要简便格式则可以这样写：table[border=1]>caption{Test}+tr*2>td{内容$}*3摁下tab即可
此时会自动生成一个2行3列的表格
$表示数字自增，从1开始，[ ]里面添加样式，+可以理解为相邻同辈选择器，>可以理解为后代选择器，后面CSS会讲到
其实一个完整的表格由：caption（标题)、thead（表头）、tbody（表体）和tfoot（表尾）四部分组成，我们一般将th写在表头里，信息写在表体里，附加信息写在表尾
| 1 | 2 | 3 | 4 |
|---|---|---|---|
| 1-1 | 1-2 | 1-3 | 1-4 |
| 2-1 | 2-2 | 2-3 | |
| 3-1 | 3-2 | 3-3 | |
| 批注 | |||
注意，如果你想要修改多行，可以摁住alt键。然后鼠标点击你想修改的行（必须要点击到你想修改的位置上，比如，你想在每一行的td后面添加相同的属性，此时，你摁住alt键后，鼠标点击的位置必须是td符号后面），选完后松开alt，此时便可以进行多行的修改
以上便是表格和列表的一些基础操作，都是很基本的操作，没什么难度，重要的是使用，当然在设计时，主要使用css来设计样式，这里只是用作展示。转载地址：http://oyvrn.baihongyu.com/