html列表,表格等标签

1.列表
无序列表 ul
一列没有顺序的列表(用的最多)
作用:显示一列没有排列顺序的数据

语义:一组没有顺序的数据

代码:

<ul>
  <li>列表项1</li>
  <li>列表项2</li>
  <li>列表项3</li>
  ......
</ul>

注意:

  • 无序列表中的数据没有先后顺序之分
  • 中只能嵌套
  • ,不能放其他标签或者文字
  • 标签中可以嵌套任意标签(嵌套ul都可以)

有序列表 ol
一列有顺序的列表(用的很少)
作用:显示一列有顺序的数据

语义:一组有顺序的数据

<ol>
  <li>列表项1</li>
  <li>列表项2</li>
  <li>列表项3</li>
  ......
</ol>

注意:

  • 有序列表中的数据有先后顺序之分
  • 中只能嵌套
  • ,不能放其他标签或者文字
  • 标签中可以嵌套任意标签(ul都可以)

现在一般情况下ul标签用的比较多,ol标签用的比较少(关键看语义,和样式无关)。
自定义列表 dl
一列格式自定义的列表(几乎不用)
作用:显示一列数据,格式自己定义

dt : 标题

dd : 列表正文

代码:

<dl>
  <dt>小标题</dt>
  <dd>小标题的解释1</dd>
  <dd>小标题的解释2</dd>
</dl>

2.HTML的空格合并现象
在HTML代码中同时出现多少个空格、缩进、换行。最后浏览器只会解析出一个空格显示
3.表格table
将数据以表格的形式在网页中展示

感知表格相关标签:
<table></table> : 代表 表格
<tr></tr> : 代表一行 (row :)
<td></td> : 代表一个标准单元格

创建表格

<table>
	<tr>
		<td>单元格</td>
		<td>单元格</td>
	</tr>
	<tr>
		<td>单元格</td>
		<td>单元格</td>
	</tr>
</table>

表格的属性
html列表,表格等标签_合并单元格
表格中的其他标签
html列表,表格等标签_合并单元格_02
合并单元格 (左上原则)
上下合并------》跨行合并:属性: rowspan=“合并的个数”------》留住最上,删除其他

左右合并------》跨列合并:属性: colspan=“合并的个数”-------》留住最左,删除其他

1.确定合并哪几个单元格

2.利用左上原则,确定保大保小

3.确定跨行(rowspan)还是跨列合并(colspan)

步骤:

  1. 通过左上原色,确定保留的单元格,给他添加属性(rowspan/colspan),属性值就是合并单元格的个数
  2. 找到要删除的单元格,删除掉就行了~