zoukankan      html  css  js  c++  java
  • 一个漂亮的table样式

    代码
    <html> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312"utf-8" /> 
    <title>坏狼安全网-漂亮CSS Tables</title> 
    </head> 
    <style type="text/css"> 
    /* CSS Document */ 

    body 
    { 
    font
    : normal 11px auto "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; 
    color
    : #4f6b72; 
    background
    : #E6EAE9; 
    } 

    { 
    color
    : #c75f3e; 
    } 

    #mytable 
    { 
    width
    : 700px; 
    padding
    : 0; 
    margin
    : 0; 
    } 

    caption 
    { 
    padding
    : 0 0 5px 0; 
    width
    : 700px; 
    font
    : italic 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; 
    text-align
    : right; 
    } 

    th 
    { 
    font
    : bold 11px "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; 
    } 
    /*power by www.winshell.cn*/ 
    th.nobg 
    { 
    border-top
    : 0; 
    border-left
    : 0; 
    border-right
    : 1px solid #C1DAD7; 
    background
    : none; 
    } 

    td 
    { 
    border-right
    : 1px solid #C1DAD7; 
    border-bottom
    : 1px solid #C1DAD7; 
    background
    : #fff; 
    font-size
    :11px; 
    padding
    : 6px 6px 6px 12px; 
    color
    : #4f6b72; 
    } 
    /*power by www.winshell.cn*/ 

    td.alt 
    { 
    background
    : #F5FAFA; 
    color
    : #797268; 
    } 

    th.spec 
    { 
    border-left
    : 1px solid #C1DAD7; 
    border-top
    : 0; 
    background
    : #fff no-repeat; 
    font
    : bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; 
    } 

    th.specalt 
    { 
    border-left
    : 1px solid #C1DAD7; 
    border-top
    : 0; 
    background
    : #f5fafa no-repeat; 
    font
    : bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; 
    color
    : #797268; 
    } 
    /*---------for IE 5.x bug*/ 
    html>body td
    { font-size:11px;} 
    body,td,th 
    { 
    font-family
    : 宋体, Arial; 
    font-size
    : 12px; 
    } 
    </style> 
    <body> 
    <table id="mytable" cellspacing="0" summary="The technical specifications of the Apple 

    PowerMac G5 series"
    > 
    <caption> </caption> 
    <tr> 
    <th scope="col">姓名</th> 
    <th scope="col">年龄</th> 
    <th scope="col">电话</th> 
    <th scope="col">居住地点</th> 
    </tr> 
    <tr> 
    <td class="row">badwolf</td> 
    <td class="row">100</td> 
    <td class="row">010-110</td> 
    <td class="row">中国北京</td> 
    </tr> 
    </table> 

    </body> 
    </html

  • 相关阅读:
    wordpress站点更换域名了如何快速设置
    wordpress调用文章摘要,若无摘要则自动截取文章内容字数做为摘要
    宝塔https部署没成功的原因排查
    全球百大网站排行榜6月榜出炉
    深度 | 邢波教授谈人工智能科学路径:为人工智能装上「无穷动」引擎
    C++中public,protected,private派生类继承问题和访问权限问题
    谁再说Matlab速度慢,我跟谁急
    C++常用的#include头文件总结
    Visual Studio的调试技巧
    How to (seriously) read a scientific paper
  • 原文地址:https://www.cnblogs.com/quanhai/p/1701169.html
Copyright © 2011-2022 走看看