CSS样式三
1，列表样式
1-1，列表类型
无序列表项的标志 (marker) 是出现在各列表项旁边的圆点。在有序列表中，标志可能是字母、数字或另外某种计数体系中的一个符号。
要修改列表项的标志类型，使用属性 list-style-type：
.ul1 { list-style-type: square }/*方块*/
.ul2 { list-style-type: none }/*没有*/
运行效果：
1-2，列表项图像
对各标志使用一个图像，利用 list-style-image 属性：
li {
list-style-image: url(../img/style-img.png)
}
运行效果：
1-3，列表标识位置
标志出现在列表项内容之外还是内容内部，利用 list-style-position属性：
li { border: 2px solid #fa037b }
.ul1 { list-style-position: outside } /*在外面*/
.ul2 { list-style-position: inside } /*在里面*/
运行效果：
2，表格样式
1-1，边框
设置表格边框，使用 border 属性
table, th, td {
border: 2px solid #fa037b
}
运行效果：
table、th 以及 td 元素都有独立的边框
如果表格只显示单线条边框，可以用 border-collapse 属性。
border-collapse 属性设置是否将表格边框折叠为单一边框：
table { border-collapse: collapse }
table, th, td {
border: 2px solid #fa037b
}
运行效果：
1-2，宽度和高度
通过 width 和 height 属性定义表格的宽度和高度
table, th, td {
border: 2px solid #fa037b
}
th {
width: 100px;
height: 50px
}
运行效果：
1-3，文本对齐
text-align 和 vertical-align 属性设置表格中文本的对齐方式
1】text-align 属性设置水平对齐方式，如左对齐、右对齐或者居中
2】vertical-align 属性设置垂直对齐方式，如顶部对齐、底部对齐或居中对齐
td {
height: 50px;
vertical-align: bottom;/*垂直对齐*/
text-align: center /*水平对齐*/
}
运行效果：
1-4，内边距
表格中设置内容与边框的距离，为 td 和 th 元素设置 padding 属性
td { padding: 20px }
运行效果：
1-5，表格颜色
设置边框颜色和th ， td 的背景色
table, th, td {
border: 2px solid #fa037b
}
th {
background-color: #8A2BE2;
color: #FFF
}
td {
background-color: #556B2F;
color: #8B0000
}
运行效果：
