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 相关文章推荐
常用的四种CSS透明属性介绍
Apr 12 HTML / CSS
移动端Web页面的CSS3 flex布局快速上手指南
May 31 HTML / CSS
CSS3与动画有关的属性transition、animation、transform对比(史上最全版)
Aug 18 HTML / CSS
浅谈css3中的渐进增强和优雅降级
Dec 01 HTML / CSS
纯css3使用vw和vh实现自适应的方法
Feb 09 HTML / CSS
基于CSS3的animation属性实现微信拍一拍动画效果
Jun 22 HTML / CSS
css3 实现滚动条美化效果的实例代码
Jan 06 HTML / CSS
html5使用canvas绘制一张图片
Dec 15 HTML / CSS
使用纯HTML5编写一款网页上的时钟的代码分享
Nov 16 HTML / CSS
html5 canvas绘制网络字体的常用方法
Aug 26 HTML / CSS
利用html+css实现菜单栏缓慢下拉效果的示例代码
Mar 30 HTML / CSS
web前端之css水平居中代码解析
May 20 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获取网络上文件
2006/10/09 PHP
MySQL中create table语句的基本语法是
2007/01/15 PHP
php中获取指定IP的物理地址的代码(正则表达式)
2011/06/23 PHP
PHP遍历并打印指定目录下所有文件实例
2014/02/10 PHP
php中用memcached实现页面防刷新功能
2014/08/19 PHP
PHP随机获取未被微信屏蔽的域名(微信域名检测)
2017/03/19 PHP
点击广告后才能获得下载地址
2006/10/26 Javascript
JavaScript 放大镜 放大倍率和视窗尺寸
2011/05/09 Javascript
javascript实现颜色渐变的方法
2013/10/30 Javascript
javascript 终止函数执行操作
2014/02/14 Javascript
兼容所有浏览器的js复制插件Zero使用介绍
2014/03/19 Javascript
js简单抽奖代码
2015/01/16 Javascript
JS实现在页面随时自定义背景颜色的方法
2015/02/27 Javascript
使用RequireJS优化JavaScript引用代码的方法
2015/07/01 Javascript
jQuery EasyUi实战教程之布局篇
2016/01/26 Javascript
浅谈javascript运算符——条件,逗号,赋值,()和void运算符
2016/07/15 Javascript
JavaScript模仿Pinterest实现图片预加载功能
2016/10/25 Javascript
Three.js利用性能插件stats实现性能监听的方法
2017/09/25 Javascript
vue移动端弹框组件的实例
2018/09/25 Javascript
微信小程序系列之自定义顶部导航功能
2019/05/21 Javascript
解决layer 动态加载select 失效的问题
2019/09/18 Javascript
Python实现从url中提取域名的几种方法
2014/09/26 Python
Python实现视频下载功能
2017/03/14 Python
Python下实现的RSA加密/解密及签名/验证功能示例
2017/07/17 Python
python用列表生成式写嵌套循环的方法
2018/11/08 Python
利用setuptools打包python程序的方法步骤
2020/01/18 Python
python+OpenCV实现图像拼接
2020/03/05 Python
ubuntu 安装pyqt5和卸载pyQt5的方法
2020/03/24 Python
Python 串口通信的实现
2020/09/29 Python
Waterford加拿大官方网站:世界著名的水晶杯品牌
2016/11/01 全球购物
Ted Baker美国官网:英国时尚品牌
2018/10/29 全球购物
村干部培训班主持词
2014/03/28 职场文书
先进个人评语大全
2015/01/04 职场文书
公司股份转让协议书范本
2015/01/28 职场文书
历史博物馆观后感
2015/06/05 职场文书
详解Python中的进程和线程
2021/06/23 Python