css设置table样式_table的样式怎么设置

css设置table样式_table的样式怎么设置漂亮的table表格样式css源码漂亮的table表格样式css源码<head><title></title><styletype="text/css">table{border-collapse:collapse;margin:0…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺


漂亮的table表格样式css源码漂亮的table表格样式
css源码
css设置table样式_table的样式怎么设置

<head>
    <title></title>
    <style type="text/css">
        table
        {
            border-collapse: collapse;
            margin: 0 auto;
            text-align: center;
        }
        table td, table th
        {
            border: 1px solid #cad9ea;
            color: #666;
            height: 30px;
        }
        table thead th
        {
            background-color: #CCE8EB;
            width: 100px;
        }
        table tr:nth-child(odd)
        {
            background: #fff;
        }
        table tr:nth-child(even)
        {
            background: #F5FAFA;
        }
    </style>
</head>
<body>
    <table width="90%" class="table">
        <caption>
            <h2>
                车间能源消耗比例</h2>
        </caption>
        <thead>
            <tr>
                <th>
                    车间
                </th>
                <th>
                    产量
                </th>
                <th>
                    电量
                </th>
                <th>
                    单耗
                </th>
            </tr>
        </thead>
        <tr>
            <td>
                109
            </td>
            <td>
                13
            </td>
            <td>
                1.34
            </td>
            <td>
                213
            </td>
        </tr>
        <tr>
            <td>
                109
            </td>
            <td>
                13
            </td>
            <td>
                1.34
            </td>
            <td>
                213
            </td>
        </tr>
        <tr>
            <td>
                109
            </td>
            <td>
                13
            </td>
            <td>
                1.34
            </td>
            <td>
                213
            </td>
        </tr>
        <tr>
            <td>
                109
            </td>
            <td>
                13
            </td>
            <td>
                1.34
            </td>
            <td>
                213
            </td>
        </tr>
        <tr>
            <td>
                109
            </td>
            <td>
                13
            </td>
            <td>
                1.34
            </td>
            <td>
                213
            </td>
        </tr>
        <tr>
            <td>
                109
            </td>
            <td>
                13
            </td>
            <td>
                1.34
            </td>
            <td>
                213
            </td>
        </tr>
    </table>
</body>
</html>






版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/191552.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • Hbase面试题(面经)整理

    Hbase面试题(面经)整理1.Hbase是什么?hbase的特点是什么?Hbase一个分布式的基于列式存储的数据库,基于Hadoop的hdfs存储,zookeeper进行管理。 Hbase适合存储半结构化或非结构化数据,对于数据结构字段不够确定或者杂乱无章很难按一个概念去抽取的数据。 Hbase为null的记录不会被存储。 基于的表包含rowkey,时间戳,和列族。新写入数据时,时间戳更新,同…

  • MySQL TIMESTAMPDIFF函数简介「建议收藏」

    MySQL TIMESTAMPDIFF函数简介「建议收藏」MySQLTIMESTAMPDIFF函数简介TIMESTAMPDIFF(unit,begin,end);TIMESTAMPDIFF函数返回begin-end的结果,其中begin和end是DATE或DATETIME表达式。TIMESTAMPDIFF函数允许其参数具有混合类型,例如,begin是DATE值,end可以是DATETIME值。如果使用DATE值,则TIMESTAMPDIFF函数将其视为时间部分为“00:00:00”的DATETIME值。unit参数是确定(end-begin)的结果

  • linux 命令chmod 755的意思[通俗易懂]

    linux 命令chmod 755的意思[通俗易懂]chmod是Linux下设置文件权限的命令,后面的数字表示不同用户或用户组的权限。 一般是三个数字:第一个数字表示文件所有者的权限第二个数字表示与文件所有者同属一个用户组的其他用户的权限第三个数字表示其它用户组的权限。      权限分为三种:读(r=4),写(w=2),执行(x=1)。综合起来还有可读可执行(rx=5=4+1)、可读可写(rw=6=4+2)、可读可写可执行(…

  • 小学计算机画线反思,小学四年级数学上册《画平行线》教学反思[通俗易懂]

    小学计算机画线反思,小学四年级数学上册《画平行线》教学反思[通俗易懂]小学四年级数学上册《画平行线》教学反思过去,对于平行线的画法,我也感到很不理解,特别是用尺子移来移去,实在太麻烦,对于平行线的理解,学生只知道“在同一平面内不相交的两条直线是平行线”,而不相交的实质是“两条直线间的距离是固定的.”学生并没有直观感受。正是基于这样的认识画平行线的教学只能由教师传授给学生,他们也只能是机械的模仿,也就是简单的完成操作工的活动,没有任何思维的含量,不能算真正意义上的脑力…

  • Navicat15激活码一直生成不了(注册激活)

    (Navicat15激活码一直生成不了)好多小伙伴总是说激活码老是失效,太麻烦,关注/收藏全栈君太难教程,2021永久激活的方法等着你。IntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,下面是详细链接哦~https://javaforall.cn/100143.htmlHQE565NV3W-eyJsaWNlbnNlSWQi…

  • 阿里面试题:ConcurrentHashMap为什么是线程安全的?

    阿里面试题:ConcurrentHashMap为什么是线程安全的?阿里面试题:ConcurrentHashMap为什么是线程安全的?ConcurrentHashMap,其实是线程安全的HashMap,所以阅读ConcurrentHashMap,建议先阅读一下两篇介绍HashMap的文章你真的懂大厂面试题:HashMap吗?jdk1.7HashMap中的致命错误:循环链表jdk1.7ConcurrentHashMapjdk1.7Concu…

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号