使用CSS，主要是可以列出进一步的样式，并可用图像作列表项标记。
使用list-style-type属性指定列表项标记的类型
参考值：
disc：默认，实心圆circle：空心圆square：实心方块decimal：数字upper-roman：大写罗马数字(I, II, III, IV, V等)lower-roman：小写罗马数字(i, ii, iii, iv, v等)upper-alpha：大写英文字母The marker is upper-alpha (A, B, C, D, E等)lower-alpha：小写英文字母The marker is upper-alpha (a, b, c, d, e等)使用list-style-image属性指定列表项标记的图像 语法：
ul { list-style-image: url('图片路径'); }使用list-style属性 按照
list-style-typelist-style-position (属性指示如何相对于对象的内容绘制列表项标记,参考值有：inside outside)list-style-image的顺序填写
实例：
<!DOCTYPE html> <html> <head> <style> ul.sai{list-style:square url('sai.jpg');} ul.circle{list-style:circle;} ol.upper-roman{list-style:upper-roman inside;} ol.upper-alpha{list-style:upper-alpha outside;} </style> <meta charset = "utf-8"/> <title>列表</title> </head> <body> <ul class = "sai"> <li>可乐</li> <li>雪碧</li> <li>芬达</li> </ul> <ul class = "circle"> <li>可乐</li> <li>雪碧</li> <li>芬达</li> </ul> <ol class = "upper-alpha"> <li>可乐</li> <li>雪碧</li> <li>芬达</li> </ol> <ol class = "upper-roman"> <li>可乐</li> <li>雪碧</li> <li>芬达</li> </ol> </body> </html>结果：
指定CSS表格边框，使用border属性。 宽度和高度也是由width和height设置 border-collapse 属性设置表格的边框是否被折叠成一个单一的边框或隔开
table,th,td { border:5px solid red; border-collapse:collapse; height:50px; width:20%; }与文本设置一样 text-align属性设置水平对齐方式 同理， 背景background属性设置， 填充padding 字体颜色color
table { color:blue; text-align:center; } td { padding:15px; }实例：
<!DOCTYPE html> <html> <head> <style> table,th,td { border:5px solid red; border-collapse:collapse; background:yellow; width:20%; height:50px; text-align:center; } th { color:blue; } td { padding:15px; } </style> <meta charset = "utf-8"/> <title>表格</title> </head> <body> <table> <tr> <th>主食</th><th>饮料</th> </tr> <tr> <td>汉堡</td><td>可乐</td> </tr> <tr> <td>薯条</td><td>芬达</td> </tr> </table> </body> </html>结果：
