【CSS3】表格、列表

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta charset="utf-8">
 5     <title></title>
 6     <link rel="stylesheet" type="text/css" href="style.css">
 7 </head>
 8 <body>
 9     <table border=""><!--border属性只要设置,值为空也能显示边框-->
10         <caption>我的表格</caption>
11         <tr><td>单元格单元格单元格单元格单元格单元格</td><td>单元格</td><td>单元格</td></tr>
12         <tr><td>单元格</td><td></td><td>单元格</td></tr>
13         <tr><td>单元格</td><td>单元格</td><td>单元格</td></tr>
14     </table>
15     <ul>
16         <li>无序列表项1</li>
17         <li>无序列表项2</li>
18         <li>无序列表项3</li>
19     </ul>
20     <ol>
21         <li>有序列表项1</li>
22         <li>有序列表项2</li>
23         <li>有序列表项3</li>
24     </ol>
25 </body>
26 </html>
 1 table{
 2     width: 200px;
 3     border-collapse:;/*默认值separate双边框;collapse单一边框。*/
 4     border-spacing: 2px;/*默认值2px;当border-collapse为collapse时此设置有效果,双边框的间距*/
 5     caption-side: bottom;/*默认值top表格之上,bottom表格之下。*/
 6     empty-cells:hide;/*默认值show显示空单元格;hide隐藏空单元格,此时需要border-collapse设置为separate才能看到效果*/
 7     table-layout: ;/*默认值auto;fixed列宽由表格宽度和列宽设定*/
 8 }
 9 ul{
10     list-style-type:upper-alpha;/*none无标记;disc默认实心圆;circle空心圆;square实心方块;list-style-type属性值在ul和ol上通用。*/
11     list-style-position: ;/*标志位置,默认outside,可设inside*/
12     /*list-style-image: url("img/鸟1.jpg");*//*默认值none*/
13 }
14 ol{
15     list-style-type:upper-alpha;/*默认decimal数字;decimal-leading-zero以01开头的数字;lower-roman小写罗马数字;upper-roman大写罗马数字;lower-alpha小写字母;upper-alpha大写字母;日文、拉丁文……等其他字符,可查CSS手册。*/
16     list-style-position: ;
17     /*list-style-image: url("img/鸟1.jpg");*/
18     list-style: circle inside;/*此属性可同时设置其他三个属性值*/
19 }
原文地址:https://www.cnblogs.com/xiongjiawei/p/6758509.html