位置: IT常识 - 正文

如何完美地去除表格的“双线”(如何简单去除)

编辑:rootadmin
想必大家在做网页表格的时候一定遇到过这种情况吧 表格出现了“双线”,但是我们需要一个“单线”的表格 比较常用的解决方案 解决方案1: 在表格的样式中添加border-collapse: collapse;以设置边框合并(如果border-collapse的属性值为collapse,则会忽略 bord ...

推荐整理分享如何完美地去除表格的“双线”(如何简单去除),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:如何轻松去除,如何简单去除,如何除掉,如何轻松去除,如何轻松去除,如何完美地去除水印,如何简单去除,如何完美的去除,内容如对您有帮助,希望把文章链接给更多的朋友!

想必大家在做网页表格的时候一定遇到过这种情况吧

表格出现了“双线”,但是我们需要一个“单线”的表格

比较常用的解决方案

解决方案1:

在表格的样式中添加border-collapse: collapse;以设置边框合并(如果border-collapse的属性值为collapse,则会忽略 border-spacing 和 empty-cells 属性),效果如下:

中间的那一条线特别粗,强迫症表示巨不舒服

解决方案2:

如何完美地去除表格的“双线”(如何简单去除)

在表格样式中添加border-spacing: 0;(由于HTML5已经放弃cellspacing这个属性,所以用border-spacing: 0;这个样式来代替)以设置相邻单元格边框间的距离为0,效果如下:

表格的底边还是“双线”,没有达到去除“双线”的目的

我的解决方案

以上两种方法都没有很好地解决“双线”这个问题,那么究竟什么方法可以完美地把“双线”这个问题解决呢?

众所周知,在css中,万物皆为盒子,我们可以把表格看成一个大盒子,单元格看成大盒子里的几个小盒子

首先设置表格(大盒子)为黑色(为了区分,我暂时把字改成白色):

table {background: #000;color: #fff;}

接着,我们把单元格的背景改成白色(再把字改回黑色):

td,th {background: #fff;}

最后我们可以按照我们的需求对表格进行改变

最终的HTML&CSS代码<!DOCTYPE html><html><head><meta charset="utf-8"><title>表格</title><link type="text/css" rel="stylesheet" href="https://www.cnblogs.com/Lance-Blog/p/css%E6%96%87%E4%BB%B6%E8%B7%AF%E5%BE%84"/></head><body><table width="70%"><tr><th>Month</th><th>Savings</th></tr><tr><td align="center">January</td><td align="center">$100</td></tr></table></body></html>table {background: #000;}td,th {background: #fff;}

以上就是《如何完美地去除表格的“双线”》的所有内容,感谢观看

本文链接地址:https://www.jiuchutong.com/zhishi/304753.html 转载请保留说明!

上一篇:WordPress数据库修改用户名方法(wordpress建立数据库错误)

下一篇:phpcms后台路径怎么改(phpcms怎么用)

  • 资源税的计税依据为应税产品的开采量
  • 劳务公司为一般纳税人的税率
  • 车险车船税会计分录
  • 当月购入固定资产计提折旧吗
  • 民办非企业工会经费
  • 金蝶利润表没有数据怎么办
  • 企业一般户怎么注销
  • 非财政补助支出
  • 在途物资材料采购的区别
  • 咨询案例模板
  • 小微企业每年可以开多少发票北京
  • 城建税计税依据及税率
  • 小规模纳税人没有达到起征点怎么申报附加
  • 个人接受捐赠要开发票吗
  • 产业政策鼓励类
  • win11开机蓝屏怎么解决
  • win11windows键没反应
  • 用优启通怎么装系统
  • 财政拨付专项资金进什么会计科目
  • 增值税中的视同销售区分为几种情况?
  • 真实有效的18岁身份证
  • w7防火怎么开
  • 公司注册资金存在风险吗
  • 2022年苹果iphone14视频配音乐
  • windows10安装hadoop
  • pavsrv51.exe - pavsrv51是什么进程 有什么用
  • win11搜索栏不能用
  • 保险税前扣除比例是多少
  • 融资租赁业务的特点
  • web无法运行
  • php对象的概念
  • 财务报表中固定资产清理为什么加借方余额
  • 向梵高致敬油画
  • 小微企业资金数额
  • mysqljoin查询
  • vue知识点汇总
  • 商业汇票的承兑银行必须具备下列条件
  • mysql的删除
  • 土地增值税扣除项目20%
  • 发票管理办法是法律吗
  • 企业累计预扣个税是什么
  • 个人所得税租房专项扣除标准
  • 补缴以前年度的印花税会计分录
  • 政府补助是否可以抵扣
  • 物流公司驾驶员安全教育培训
  • 在记账过程中,可能发生各种各样的差错
  • 应付账款与应付票据结合的原则
  • 期初试算平衡表资产多
  • 固定资产确认条件最新
  • 补价占整个交易金额的比例
  • 管理费用标准制定
  • sql如何学
  • 行转列sql函数
  • mysql中汉字用什么类型
  • 软碟通可以制作uefi启动盘吗
  • macos怎么使用
  • centos的top命令
  • RunClubSanDisk.exe是什么程序? 闪迪U盘广告推介程序
  • linux w
  • rundll32.exe是病毒吗
  • win10快速隐藏窗口
  • 电脑开机显示xp后无反应
  • 基于centos6安装kvm服务
  • win10提示空闲计时器已过期
  • windows桌面卡
  • 批处理 输入密码
  • wow 脚本开发
  • js转义字符串
  • python 效率优化
  • unity learn premium
  • 一起学ap
  • linux shell实战
  • python魔法方法有啥用
  • javascript create
  • jq动态设置css
  • 国家税务局发票查验平台查验官网
  • 北京国家税务网官网首页
  • 快递代缴的关税有税单吗
  • 地方税收包含哪些
  • 国税系统打印不了发票怎么办
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设