Web前端

html列表

在HTML文件中，除了使用标记对文字进行修饰以外，HTML还可以提供列表，可以对网页文字进行更好的布局和定义。列表项目以项目符号开始，这样有利于将不同的内容分类呈现，将项目有序或无序地罗列显示，并体现出重点。

有序列表

1）所谓有序列表，就是有顺序的列表，即列表前面带个12或abc。英文单词为“Ordered List”，标签为<ol>...</ol>，作用是在网页中显示一个有顺序的列表。

2）默认情况下，有序列表的列表项目目前显示1、2、等符号，从数字1开始计算。可以使用type属性修改有序列表序号样式，也可以定义strat属性设置序号起始值。

）type属性的具体取值及说明。

4）有序列表格式

无序列表

1）创建定义无序列表需使用无序列表标记符<ul></ul>和列表项标记符<li></li>。与ol标记符类似，ul标记符也包含一个常用的type属性，用于控制列表项前特殊符号的显示。同时，无序列表中的li标记符也具有相同的type属性。定义有序列表的语法格式如下。

2）默认情况下，无序列表的列表项目目前显示黑心实心圆点。可以使用type属性修改无序列表序号样式，也可以定义strat属性设置序号起始值。

）type属性的具体取值及说明如图 所示。

4）无序列表格式

自定义列表

1）自定义列表不是一个项目的序列，它是一系列项目和它们的解释。自定义列表以<dl>标记开始，自定义列表项目以<dt>开始，自定义列表的解释以<dd>开始。自定义列表的语法格式如下。

2）<dt>标记定义了组成列表项的名称部分，此标记只能在<dl>标记中使用。<dd>用于解释说明<dt>标记所定义的项目，此标记只能用在<dl>标记中使用。

）自定义列表格式

html表格

table常用标签

1）table标签：声明一个表格

2）tr标签：定义表格中的一行

）td和th标签：定义一行中的一个单元格，td代表普通单元格，th表示表头单元格

table常用属性

1）border ： 定义表格的边框

2）cellpadding ：定义单元格内内容与边框的距离

）cellspacing ：定义单元格与单元格之间的距离

4）align ：设置单元格中内容的水平对齐方式,设置值有left、 center 、 right 

5）valign ：设置单元格中内容的垂直对齐方式 top、middle 、bottom

6）colspan ：设置单元格水平合并

7）rowspan ：设置单元格垂直合并

传统布局

传统的布局方式就是使用table来做整体页面的布局，布局的技巧归纳为如下几点：

1）定义表格宽高，将border、cellpadding、cellspacing全部设置为0

2）单元格里面嵌套表格

）单元格中的元素和嵌套的表格用align和valign设置对齐方式

4）通过属性或者css样式设置单元格中元素的样式