复习-css列表和表格相关属性

css列表和表格相关属性

list-style:设置所有列表属性

list-style-image:将图像设置为列表项标记,主要有url值

list-style-position:设置列表项标记的放置位置,主要有outside和inside

list-style-type:设置列表项标记的类型,主要有disc、circle、square、decimal、decimal-leading-zero、lower-roman、upper-roman、lower-greek、lower-latin、armenian、georgian

border-collapse:表格合并为单一的边框

border-spacing:设置分隔单元格边框的距离

caption-side:设置表格标题的位置

empty-cells:设置是否显示表格中的空单元格

<style type = "text/css">
> .customers{  
> font-family:"Trebuchet MCN;  
> width:100%;  
> border-collapse:collapse;  
> }  
> .customer td, .customer th  
> {  
> font-size:13px;
> border:1px solid;  
> }  
> .customers th  
> {  
> font-size:14px;  
> text-align:left;  
> background-color:#A7C942;  
> color:#ffffff;  
> }  
> .customers tr.alt td
> {color:#000000;
> background-color:#EAF2D3;
> }
> </style>

<table class = "customer">
<tr>
<th>company</th>
<th>contact</th>
<\tr>
<tr class = "alt">
<td>baidu</td>
<td>china</td>
</tr>

#five li{
padding-left:20px;
background:url("icon1.jpg") no-repeat;
}
#tb{width:50%;height:100px;font-family:"宋体";border:1px solid red;border-spacing:20px;caption-side:bottom;empty-cells:hide;
}
#tb tr td{border:1px solid red}

<ul id = "five">
<li>football</li>
<li>baskerball</li>
<li>tennis</li>
<table id = "tb">
<caption>my table</caption>
<tr>
<td>单元格1</td>
<td>单元格2</td>
<td>单元格3</td>
</tr>
</table

 

>
posted @ 2018-04-02 10:45  Edge_of_Eternity  阅读(362)  评论(0编辑  收藏  举报