一、总体思路:

  1、表格无边框,背景颜色设置一种颜色(#DCDFE6),这样表格的边框的颜色就是表格的背景颜色;

  2、单元格间距为1px,背景颜色设置为白色(#FFFFFF)

    // CSS
table { background:#DCDFE6; width: 100%; }
table td { background:#FFFFF; } // HTML
<table border="0" cellspacing="1" cellpadding="0">
<tr>
<td colspan="3"><el-checkbox>仪表面板</el-checkbox></td>
</tr> <tr>
<td rowspan="2"><el-checkbox>渠道管理</el-checkbox></td>
<td><el-checkbox>渠道列表</el-checkbox></td>
<td>
<el-checkbox>新增</el-checkbox>
<el-checkbox>编辑</el-checkbox>
<el-checkbox>删除</el-checkbox>
</td>
</tr>
</table>

二、效果图

HTML table 表格边框的更多相关文章

  1. [转]CSS如何设置html table表格边框样式

    原文地址:http://www.divcss5.com/wenji/w503.shtml 对table设置css样式边框,分为几种情况: 1.只对table设置边框 2.对td设置边框 3.对tabl ...

  2. CSS 设置TABLE 表格 边框

    /*table列表 合并边框设置*/ .tablelist { border-collapse:collapse; } /*table列表 设置边框宽度及颜色*/ .tablelist td { bo ...

  3. table表格边框样式

    ; border-left:1px solid #aaa; border-top:1px solid #aaa; } td{border-right:1px solid #aaa; border-bo ...

  4. table表格设置边框线为单实线

    设置table表格边框为单实线的方法有两种 第一种方法就是利用table标签cellspacing=0属性来实现,cellspacing是内边框和外边框的距离,这种方法实现的看起来是单实线,其实是内边 ...

  5. css如何让表格table的边框为1像素呢

    在Html中使用table是网页制作中必不可缺的一部分,如果直接给css设置table里面的td边框为1像素的话,那么实际我们从网页上看到的效果却不是1像素. 那么我们怎么用css让table的边框为 ...

  6. html表格table设置边框

    对于很多初学HTML的人来说,表格<table>是最常用的标签了,但对于表格边框的控制,很多初学者却不甚其解. 一般我们用表格的时候总会给它个border属性,比如:<table b ...

  7. table 表格 细边框 最简单样式

    table 表格细边框的效果实现方法虽然不难,但网上简单有效的方法却很少,在此记录一下 css 样式 /** table 细边框 **/ table{border-collapse: collapse ...

  8. 【丛林】HTML Table 表格浅谈(边框、隔行变色

    此例子已经包含本文大部分内容,请对照参考.查看代码 > 定义和用法 table标签定义 HTML 表格. 创建表格的四要素:table.tr.th.td <table> 整个表格以& ...

  9. element table 表格 修改背景为透明并去除边框

    .el-table{ /* 表格字体颜色 */ color:white; /* 表格边框颜色 */ /* border: 0.5px solid #758a99; */ height: 500px; ...

随机推荐

  1. 清华大学&中国人工智能学会:2019人工智能发展报告

    2019年11月30日,2019中国人工智能产业年会重磅发布<2019人工智能发展报告>(Report of Artificial Intelligence Development 201 ...

  2. 洛谷p3398仓鼠找suger题解

    我现在爱死树链剖分了 题目 具体分析的话在洛谷blog里 这里只是想放一下改完之后的代码 多了一个son数组少了一个for 少了找size最大的儿子的for #include <cstdio&g ...

  3. Jmeter(四十八)_动态线程分析HTML测试报告

    概述 jmeterGUI模式下,性能测试的结果往往误差很大,因为GUI本身就会消耗一部分资源.所以我们常常用命令行去跑性能脚本,得出结果 同时,jmeter在命令行下还可以生成多维度的测试报告,里面包 ...

  4. prometheus(docker)安装和报警 -- nginx域名监控

    软件组件:prometheusalertmanagerprometheus-webhook-dingtalk nginx-vts-exporternginx (###--add-module=../n ...

  5. linux安装yasm报错

    进入yasm-1.2.0, 输入指令 ./configure //编译yasm make && make install //安装yasm,安装完成即可. 报错信息 make[2]: ...

  6. 记一次 HttpClient 死锁问题

    原文:http://blog.kail.xyz/post/2019-04-21/tools/httpclient-lock.html 最近遇到一个使用 Apache HttpClient 过程中的问题 ...

  7. Windows Server 2008 + IIS 7+ ASP.NET 并发优化

    Windows Server 2008 + IIS 7+ ASP.NET 并发优化 站点出现这样的错误信息: Error Summary: HTTP Error 503.2 - Service Una ...

  8. python lambda表达式简单用法【转】

    python lambda表达式简单用法 1.lambda是什么? 看个例子: g = lambda x:x+1 看一下执行的结果: g(1) >>>2 g(2) >>& ...

  9. IIS连接数、并发连接数、最大并发工作线程数、应用程序池的队列长度、应用程序池的最大工作进程数详解

    IIS:连接数.并发连接数.最大并发工作线程数.应用程序池的队列长度.应用程序池的最大工作进程数详解 iis性能指标的各种概念:连接数.并发连接数.最大并发工作线程数.应用程序池的队列长度.应用程序池 ...

  10. linux系统错误码大全

    #define EPERM 1 /* Operation not permitted */ #define ENOENT 2 /* No such file or directory */ #defi ...