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 响应式媒体查询的示例代码
Sep 25 HTML / CSS
多重CSS背景动画实现方法示例
Apr 04 HTML / CSS
html5新增的定时器requestAnimationFrame实现进度条功能
Dec 13 HTML / CSS
html5/css3响应式页面开发总结
Oct 16 HTML / CSS
用html5的canvas画布绘制贝塞尔曲线完整代码
Aug 14 HTML / CSS
让IE9以下版本的浏览器兼容HTML5的方法
Mar 12 HTML / CSS
HTML5几个设计和修改的页面范例分享
Sep 29 HTML / CSS
探索HTML5本地存储功能运用技巧
Mar 02 HTML / CSS
h5网页水印SDK的实现代码示例
Feb 19 HTML / CSS
HTML5新增form控件和表单属性实例代码详解
May 15 HTML / CSS
html5利用canvas实现颜色容差抠图功能
Dec 23 HTML / CSS
DIV CSS实现网页背景半透明效果
Dec 06 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
Win2003服务器安全加固设置--进一步提高服务器安全性
2007/05/23 PHP
php header功能的使用
2013/10/28 PHP
用PHP实现弹出消息提示框的两种方法
2013/12/17 PHP
js直接编辑当前cookie的脚本
2008/09/14 Javascript
使用NodeJs 开发微信公众号(三)微信事件交互实例
2016/03/02 NodeJs
JavaScript html5 canvas绘制时钟效果(二)
2016/03/27 Javascript
vue-quill-editor实现图片上传功能
2017/08/08 Javascript
Vue项目部署在Spring Boot出现页面空白问题的解决方案
2018/11/26 Javascript
[jQuery] 事件和动画详解
2019/03/05 jQuery
JS实现水平遍历和嵌套递归操作示例
2019/08/15 Javascript
vue+elementUI实现图片上传功能
2019/08/20 Javascript
JS+HTML5本地存储Localstorage实现注册登录及验证功能示例
2020/02/10 Javascript
jQuery实现的上拉刷新功能组件示例
2020/05/01 jQuery
Python中操作mysql的pymysql模块详解
2016/09/13 Python
机器学习经典算法-logistic回归代码详解
2017/12/22 Python
使用python将mysql数据库的数据转换为json数据的方法
2019/07/01 Python
Python使用sklearn实现的各种回归算法示例
2019/07/04 Python
使用 Python 处理 JSON 格式的数据
2019/07/22 Python
Python单元测试工具doctest和unittest使用解析
2019/09/02 Python
Python操作注册表详细步骤介绍
2020/02/05 Python
Python新手学习标准库模块命名
2020/05/29 Python
潘多拉意大利官方网上商城:网上选购PANDORA珠宝
2018/10/07 全球购物
Tod’s英国官方网站:意大利奢华手工制作手袋和鞋履
2019/03/15 全球购物
千禧酒店及度假村官方网站:Millennium Hotels and Resorts
2019/05/10 全球购物
编写类String的构造函数、析构函数和赋值函数
2012/05/29 面试题
一套SQL笔试题
2016/08/14 面试题
网络安全方面的面试题
2015/11/04 面试题
经济信息管理专业大学生求职信
2013/09/27 职场文书
时尚休闲吧创业计划书
2014/01/25 职场文书
主持人婚宴答谢词
2014/01/28 职场文书
主管会计岗位责任制
2014/02/10 职场文书
保护环境建议书100字
2014/05/13 职场文书
办公室领导干部作风整顿个人整改措施
2014/09/17 职场文书
法定代表人证明书
2014/11/28 职场文书
奖学金主要事迹范文
2015/11/04 职场文书
python 实现图片特效处理
2022/04/03 Python