当前位置: 代码迷 >> Web前端 >> table框子样式
  详细解决方案

table框子样式

热度:252   发布时间:2012-09-05 15:19:35.0
table边框样式
以前不懂给table加细边框,无意中看到有人设计的网页有这种样式:
<html>
<head>
	<title>XXX</title>
	<style>
		.table_border{
			border: solid 1px green;
			border-collapse: collapse;
			overflow:auto;
			overFlow-x: scroll ;
			border-style: solid ;        
		}
		.table_border tr th{
			padding-left:4px;
			height:27px;
			border: solid 1px green;
		}
		.table_border tr td{
			height:25px;
			padding:4px;
			border: solid 1px green;
		}
	</style>
</head>
<body>
<table class="table_border" width="100%" border="0" cellpadding="0" cellspacing="0.5">  
       <tr>  
           <th width="60"><input type="checkbox" name="all_box" id="all_box" onclick="selectCheckBoxAll('all_box','chkBoxName')"/></th>  
           <th></th>  
           <th></th>  
           <th></th>  
           <th></th>  
           <th></th>  
       </tr>                    
        <tr>  
            <td width="60" align="center"><input type="checkbox" name="chkBoxName" id="all_box" value="<s:property value='#userGroup.groupId'/>"/></td>  
            <td></td>  
            <td></td>                                  
            <td></td>                                                                
            <td></td>                                                                   
            <td></td>                             
        </tr> 
        <tr>  
            <td width="60" align="center"><input type="checkbox" name="chkBoxName" id="all_box" value="<s:property value='#userGroup.groupId'/>"/></td>  
            <td></td>  
            <td></td>                                  
            <td></td>                                                                
            <td></td>                                                                   
            <td></td>                             
        </tr>                                                     
</table>
<body>
</html>

这样就OK了!
  相关解决方案