<u id="g9yg5"></u>

<video id="g9yg5"></video>

<source id="g9yg5"></source>
<b id="g9yg5"><acronym id="g9yg5"><bdo id="g9yg5"></bdo></acronym></b>

    1. <source id="g9yg5"><track id="g9yg5"><ins id="g9yg5"></ins></track></source>

      經常使用的兩個清爽的table樣式是怎樣的(table,web開發)

      時間:2024-04-20 04:41:30 作者 : 石家莊SEO 分類 : web開發
      • TAG :

      附上兩個我經常使用的table樣式:
      經常使用的兩個清爽的table樣式是怎樣的

      代碼如下:


      <html>
      <head>
      <title></title>
      <style type="text/css">
      body,table{
      font-size:12px;
      }
      table{
      table-layout:fixed;
      empty-cells:show;
      border-collapse: collapse;
      margin:0 auto;
      }
      td{
      height:30px;
      }
      h2,h3,h4{
      font-size:12px;
      margin:0;
      padding:0;
      }
      .table{
      border:1px solid #cad9ea;
      color:#666;
      }
      .table th {
      background-repeat:repeat-x;
      height:30px;
      }
      .table td,.table th{
      border:1px solid #cad9ea;
      padding:0 1em 0;
      }
      .table tr.alter{
      background-color:#f5fafe;
      }
      </style>
      </head>
      <body>
      <table width="90%" class="table">
      <tr>
      <th>學號</th>
      <th>姓名</th>
      <th>平時</th>
      <th>期中</th>
      <th>實驗(踐)</th>
      <th>其它</th>
      <th>期末</th>
      <th>總評</th>
      </tr>
      <tr>
      <td>1</td>
      <td>1</td>
      <td>1</td>
      <td>1</td>
      <td>1</td>
      <td>1</td>
      <td>1</td>
      <td>1</td>
      </tr>
      <tr class="alter">
      <td>2</td>
      <td>2</td>
      <td>2</td>
      <td>2</td>
      <td>2</td>
      <td>2</td>
      <td>2</td>
      <td>2</td>
      </tr>
      </table>
      </body>
      </html>

      代碼如下:


      <html>
      <head>
      <title></title>
      <style type="text/css">
      .table
      {
      width: 100%;
      padding: 0;
      margin: 0;
      }
      th {
      font: bold 12px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
      color: #4f6b72;
      border-right: 1px solid #C1DAD7;
      border-bottom: 1px solid #C1DAD7;
      border-top: 1px solid #C1DAD7;
      letter-spacing: 2px;
      text-transform: uppercase;
      text-align: left;
      padding: 6px 6px 6px 12px;
      background: #CAE8EA no-repeat;
      }
      td {
      border-right: 1px solid #C1DAD7;
      border-bottom: 1px solid #C1DAD7;
      background: #fff;
      font-size:14px;
      padding: 6px 6px 6px 12px;
      color: #4f6b72;
      }
      td.alt {
      background: #F5FAFA;
      color: #797268;
      }
      th.spec,td.spec {
      border-left: 1px solid #C1DAD7;
      }
      /*---------for IE 5.x bug*/
      html>body td{ font-size:14px;}
      tr.select th,tr.select td
      {
      background-color:#CAE8EA;
      color: #797268;
      }
      </style>
      </head>
      <body>
      <table class="table" cellspacing="0" summary="The technical specifications of the Apple PowerMac G5 series">
      <tr>
      <th class="spec">選擇</th>
      <th>課程名稱</th>
      <th>課程編號</th>
      <th>已經考試次數</th>
      </tr>
      <tr>
      <td class="spec">1</td>
      <td>1</td>
      <td class="alt">1</td>
      <td>1</td>
      </tr>
      <tr class="select">
      <td class="spec">2</td>
      <td>2</td>
      <td class="alt">2</td>
      <td>2</td>
      </tr>
      <tr>
      <td class="spec">3</td>
      <td>3</td>
      <td class="alt">3</td>
      <td>3</td>
      </tr>
      </table>
      </body>
      </html>

       </div> <div class="zixun-tj-product adv-bottom"></div> </div> </div> <div class="prve-next-news">
      本文:經常使用的兩個清爽的table樣式是怎樣的的詳細內容,希望對您有所幫助,信息來源于網絡。
      上一篇:CSS中怎么實現表格細邊框下一篇:

      5 人圍觀 / 0 條評論 ↓快速評論↓

      (必須)

      (必須,保密)

      阿貍1 阿貍2 阿貍3 阿貍4 阿貍5 阿貍6 阿貍7 阿貍8 阿貍9 阿貍10 阿貍11 阿貍12 阿貍13 阿貍14 阿貍15 阿貍16 阿貍17 阿貍18
      中文字幕第63久久_欧美乱人伦视频中文字幕_337p大胆精品_午夜亚洲福利在线老司机

      <u id="g9yg5"></u>

      <video id="g9yg5"></video>

      <source id="g9yg5"></source>
      <b id="g9yg5"><acronym id="g9yg5"><bdo id="g9yg5"></bdo></acronym></b>

      1. <source id="g9yg5"><track id="g9yg5"><ins id="g9yg5"></ins></track></source>