- 所在位置：
- 首页 >
- 编程技术 >
- CSS/HTML >
- HTML中table表格边框实现思路和代码是什么
HTML中table表格边框实现思路和代码是什么
Admin 2022-07-18 群英技术资讯 665 次浏览
这篇文章给大家介绍了“HTML中table表格边框实现思路和代码是什么”的相关知识，讲解详细，步骤过程清晰，有一定的借鉴学习价值，因此分享给大家做个参考，感兴趣的朋友接下来一起跟随小编看看吧。一、总体思路：
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表格边框实现思路和代码是什么"的内容，大家可以关注群英网络的其它相关文章。
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：mmqy2019@163.com进行举报，并提供相关证据，查实之后，将立刻删除涉嫌侵权内容。
猜你喜欢
-
CSS创建进度条有几种方法，具体怎样做
本文将介绍如何使用 HTML/CSS 创建各种基础进度条及花式进度条及其动画的方式，通过本文，你可能可以学会：通过 HTML 标签 <meter> 创建进度条 通过 HTML 标签 <progress>创建进度条
-
drop-shadow函数怎样应用，有什么使用技巧
通过本文，你可以学到： 如何利用 filter: drop-shadow() 对元素的部分内容添加单重及多重阴影，以及利用多重阴影实现 Neon 效果 HTML 元素配合 filter: drop-shadow() 以及 SV
-
HTML页面中怎么显示特殊符号，怎么避免显示出错
在使用html进行编辑的时候，特殊符号往往会显示错误，极端情况下更可能导致网页崩溃。本文就来介绍一下如何显示特殊字符，感兴趣的可以了解一下
-
在HTML网页引入svg图片怎样做，有多少方法
在HTML网页引入svg图片怎样做，有多少方法?下文有实例供大家参考，对大家了解操作过程或相关知识有一定的帮助，而且实用性强，希望这篇文章能帮助大家，下面我们一起来了解看看吧。
-
用CSS3怎样做底部按钮滑入滑出的效果
这篇文章主要介绍了CSS3实现div从下往上滑入滑出效果示例，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
推荐内容
成为群英会员,开启智能安全云计算之旅
立即注册
Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008
