<html>

<head>

    <title>通用table样式</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;

        }

        h1, h2, h3

        {

            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>

        <tr>

            <td>3</td>

            <td>3</td>

            <td>3</td>

            <td>3</td>

            <td>3</td>

            <td>3</td>

            <td>3</td>

            <td>3</td>

        </tr>

        <tr class="alter">

            <td>4</td>

            <td>4</td>

            <td>4</td>

            <td>4</td>

            <td>4</td>

            <td>4</td>

            <td>4</td>

            <td>4</td>

        </tr>

    </table>

</body>

</html>

通用table样式的更多相关文章

  1. Jquery学习之路(二) 实现table样式的设定

    上一篇jquery实现checkbox的全选,得到了一些朋友的建议,其中插件的定义我的确不太清楚,也闹了个笑话,有些朋友建议我去看<锋利的Jquery>,说实话正在看了.由于正在学习中,我 ...

  2. table完美css样式，table的基本样式，table样式

    table完美css样式,table的基本样式,table样式 >>>>>>>>>>>>>>>>> ...

  3. 经常使用的两个清爽的table样式

    两个我经常使用的table样式: <html> <head> <title></title> <style type="text/css ...

  4. Table样式设置

    <table class="listTable"> <tr><th width="40px">序号</th>&l ...

  5. css table样式

    1.table样式首先设置表格边框,属性设置表格的边框是否被合并为一个单一的边框. table{ border-collapse: collapse; border-spacing: 0;} 2.固定 ...

  6. html 简单的table样式

    效果预览: 代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...

  7. 好看的table样式

    收藏个好看的table样式 <style type="text/css">table.gridtable { font-family: verdana,arial,sa ...

  8. html table表格导出excel的方法 html5 table导出Excel HTML用JS导出Excel的五种方法 html中table导出Excel 前端开发 将table内容导出到excel HTML table导出到Excel中的解决办法 js实现table导出Excel，保留table样式

    先上代码   <script type="text/javascript" language="javascript">   var idTmr; ...

  9. CSS div仿table样式

    要想让div元素显示的样式与table相同,那么需要使用display属性,这个属性将告诉浏览器这些数据是制表的,将以哪种样式来渲染数据: // table --使该元素按table样式渲染 // t ...

随机推荐

  1. POJ3228 并查集或二分最大流枚举答案

    忘记写题意了.这题题意:给出每个地点的金矿与金库的数量,再给出边的长度.求取最大可通过边长的最小权值使每个金矿都能运输到金库里. 这题和之前做的两道二分枚举最大流答案的问法很相识,但是这里用最大流速度 ...

  2. 微信小程序开发心得--动画机制

    微信小程序也已出来有一段时间了,最近写了几款微信小程序项目,今天来说说感受.首先开发一款微信小程序,最主要的就是针对于公司来运营的,因为,在申请appid(微信小程序ID号)时候,需要填写相关的公司认 ...

  3. html加载和解析流程

    之前查找资料了解了html的整个渲染过程,对于理解页面加载帮助还是蛮大的,下面我用visio把它画成流程图,便于直观理解 好吧,居然要150字才能发布............ 浏览器渲染过程 浏览器渲 ...

  4. MySQLzip archive版本(5.7.19)安装教程

    1.  从官网下载zip archive版本http://dev.mysql.com/downloads/mysql/ 2. 解压缩至相应目录,并配置环境变量(将*\bin添加进path中): 3. ...

  5. 201521123072《java程序设计》第八周总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结集合与泛型相关内容. 2. 书面作业 List中指定元素的删除(题目4-1) 1.1 实验总结 在删除List中的元素中要考虑元素删 ...

  6. 201521123089 《Java程序设计》第8周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结集合与泛型相关内容. 1.2 选做:收集你认为有用的代码片段 2. 书面作业 本次作业题集集合 1.List中指定元素的删除(题目4 ...

  7. Akka（25）： Stream：对接外部系统-Integration

    在现实应用中akka-stream往往需要集成其它的外部系统形成完整的应用.这些外部系统可能是akka系列系统或者其它类型的系统.所以,akka-stream必须提供一些函数和方法来实现与各种不同类型 ...

  8. Day-18: 电子邮件

    ---恢复内容开始--- 假设要从**@163.com发送邮件到**@sina.com,会经过下面几个过程: 首先,你得使用邮件代理软件(也就是MUA:Mail User Agent),例如Outlo ...

  9. headfirst设计模式（3）—装饰者模式

    序 好久没写设计模式了,自从写了两篇之后,就放弃治疗了,主要还是工作太忙了啊(借口,都是借口),过完年以后一直填坑,填了好几个月,总算是稳定下来了,可以打打酱油了. 为什么又重新开始写设计模式呢?学习 ...

  10. 前端里移动端到底比pc端多哪些知识?

    端里移动端到底比pc端多哪些知识,为啥面试时好多公司都问h5水平如何? 我做过几年的web前端开发,就简单谈谈自己的感受吧.首先来看看PC端和移动端在前端开发上的一些区别:(1)PC考虑的是浏览器兼容 ...