您的位置:首页 > Web前端 > CSS

html 双色表格样式设计

2016-06-25 15:42 381 查看
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>双色表格</title>

<script src="jquery-1.8.3.js" ></script>

 <style>

       th{

          background:#00676B;

          color:#FF4500;

          line-height:20px;

          height:30px;

        }

       td{

         padding 6px 11px;

         color: #FF0000;

         border:1px solid #95bce2;

         vertical-align:top;

         text-align: center;

       td * {

          padding 6px 11px;

       }

       tr.alt td{

          background: #ecf6fc;

       }

       tr.over td{

          background: #bcd4ec;

       }

    </style>

</head>

<body>

<center>

 <table width="364" border="1" cellspacing="0" cellpadding="0" class="table" >

 <thead>

    <th>测试1</th>

    <th>测试2</th>

    <th>测试3/th>
 </thead>

<tr>

    <td>测试数据1</td>

    <td>测试数据2</td>

    <td>测试数据3</td>

  </tr>

</table>

</center>

</body>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: