HTML table 表格边框的实现思路


Posted in HTML / CSS onOctober 12, 2019

一、总体思路:

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 表格边框的实现思路

总结

以上所述是小编给大家介绍的HTML table 表格边框的实现思路,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

HTML / CSS 相关文章推荐
纯CSS3实现质感细腻丝滑按钮
Mar 09 HTML / CSS
一款基于css3和jquery实现的动画显示弹出层按钮教程
Jan 04 HTML / CSS
CSS3动画和HTML5新特性详解
Aug 31 HTML / CSS
使用html2canvas将页面转成图并使用用canvas2image下载
Apr 04 HTML / CSS
html5的画布canvas——画出简单的矩形、三角形实例代码
Jun 09 HTML / CSS
详解使用HTML5 Canvas创建动态粒子网格动画
Dec 14 HTML / CSS
HTML5 拖放(Drag 和 Drop)详解与实例代码
Sep 14 HTML / CSS
基于HTML5的WebGL经典3D虚拟机房漫游动画
Nov 15 HTML / CSS
详解H5 活动页之移动端 REM 布局适配方法
Dec 07 HTML / CSS
利用三角函数在canvas上画虚线的方法
Jan 11 HTML / CSS
Canvas实现放大镜效果完整案例分析(附代码)
Nov 26 HTML / CSS
table设置超出部分隐藏,鼠标移上去显示全部内容的方法
Dec 24 HTML / CSS
Html5自定义字体解决方法
Oct 09 #HTML / CSS
webView加载html图片遇到的问题解决
Oct 08 #HTML / CSS
使用postMessage让 iframe自适应高度的方法示例
Oct 08 #HTML / CSS
基于 HTML5 WebGL 实现的医疗物流系统
Oct 08 #HTML / CSS
html2canvas生成清晰的图片实现打印的示例代码
Sep 30 #HTML / CSS
html5视频媒体标签video的使用方法及完整参数说明详解
Sep 27 #HTML / CSS
Html5实现首页动态视频背景的示例代码
Sep 25 #HTML / CSS
You might like
PHP远程连接MYSQL数据库非常慢的解决方法
2008/07/05 PHP
PHP 文件上传功能实现代码
2009/06/24 PHP
PHP中file_get_contents高?用法实例
2014/09/24 PHP
一个高效的JavaScript压缩工具下载集合
2007/03/06 Javascript
JQuery拖拽元素改变大小尺寸实现代码
2012/12/10 Javascript
javascript基础之查找元素的详细介绍(访问节点)
2013/07/05 Javascript
JavaScript中的无阻塞加载性能优化方案
2014/10/10 Javascript
jQuery密码强度检测插件passwordStrength用法实例分析
2015/10/30 Javascript
详解Javascript函数声明与递归调用
2016/10/22 Javascript
前端开发之CSS原理详解
2017/03/11 Javascript
JS控件bootstrap datepicker使用方法详解
2017/03/25 Javascript
微信小程序网络请求wx.request详解及实例
2017/05/18 Javascript
vue高德地图之玩转周边
2017/06/16 Javascript
深入理解ES7的async/await的用法
2017/09/09 Javascript
浅谈Node.js 沙箱环境
2018/05/15 Javascript
vue项目前端埋点的实现
2019/03/06 Javascript
Vue常用传值方式、父传子、子传父及非父子实例分析
2020/02/24 Javascript
用js编写留言板
2020/03/17 Javascript
JavaScript 中的执行上下文和执行栈实例讲解
2021/02/25 Javascript
[02:45]DOTA2英雄敌法师基础教程
2013/11/25 DOTA
[49:30]DOTA2-DPC中国联赛正赛 Dragon vs Dynasty BO3 第二场 3月4日
2021/03/11 DOTA
Python操作sqlite3快速、安全插入数据(防注入)的实例
2014/04/26 Python
详解使用pymysql在python中对mysql的增删改查操作(综合)
2017/01/18 Python
Python3之文件读写操作的实例讲解
2018/01/23 Python
详解Pytorch 使用Pytorch拟合多项式(多项式回归)
2018/05/24 Python
使用python3实现操作串口详解
2019/01/01 Python
详解Python_shutil模块
2019/03/15 Python
django多个APP的urls设置方法(views重复问题解决)
2019/07/19 Python
python 实现倒计时功能(gui界面)
2020/11/11 Python
python 通过pip freeze、dowload打离线包及自动安装的过程详解(适用于保密的离线环境
2020/12/14 Python
AJAX的优缺点都有什么
2015/08/18 面试题
资产经营总监岗位职责
2013/12/04 职场文书
护理目标管理责任书
2014/07/25 职场文书
出差报告格式模板
2014/11/06 职场文书
陕西导游词
2015/02/04 职场文书
大学生军训心得体会5篇
2019/08/15 职场文书