位置: 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怎么用)

  • 进口货物复合计税的应税消费品包括
  • 税务免抵调库是什么意思
  • 税收管辖权是什么的重要组成部分
  • 综合所得减除费用标准是什么意思
  • 工人工伤误工费赔偿多少一天
  • 缴纳销项税额要交税吗
  • 小微企业减免所得税额是怎么算出来的
  • 累计折旧计入
  • 存货成本包括消费吗
  • 资产减值损失转回的账务处理
  • 转租收入怎样缴税
  • 募集资金怎么算
  • 印花税法律制度规定不征收印花税的是什么
  • 个人持有原始股要交税吗
  • 生产型企业出口非自产产品能享有退税吗
  • 人工费用占销售收入比重
  • 商誉摊销法的优缺点
  • 国税退税怎么做账
  • 风险控制措施包括哪5个方面
  • 租用办公室协议书
  • window10过期
  • 从银行提取备用金填制什么凭证
  • 票据的追索权与再追索权
  • 商品购进核算
  • 损益类科目有哪些借贷方向
  • 盘点的原则包括
  • 手机短信是哪一年开始的
  • 用php做一个表格
  • 付工程改造余款分录
  • 企业所得税的应纳税额计算公式
  • 现金折扣的账务处理最新规定
  • 未分配利润可以转实收吗
  • 狂神说css笔记
  • php上传不了文件
  • 利息进项税是否含增值税
  • 总公司如何成立子公司
  • 车船税为什么没有发票
  • 固定资产处理的税务政策
  • 2022最新款带采集功能抖音壁纸小程序源码
  • dict在python中的作用
  • 资产负债表的累计折旧
  • 加油的电子发票在哪里找
  • 扣缴义务人如何登录电子税务局
  • sql server 2008 备份
  • 补缴以前年度的印花税会计分录
  • 租房合同 陷阱
  • 自用房地产转换为成本模式计量的投资性房地产
  • 租房交付确认书
  • 免税收入就是不征收收入,均属于税收优惠范畴
  • 转出上年的进项税怎么算
  • 调整以前年度销项税额的分录
  • 交通运输业营改增
  • 原股东将全部股权转让
  • mysql导出语句
  • win8系统怎么关闭投影
  • centos6.7防火墙
  • main.exe是什么意思
  • win10mobile升级顾问
  • tomcat配置虚拟主机
  • win8怎么彻底删除安装的软件
  • windows10累积更新很慢
  • win7c盘winsxs
  • windows 10 mobile--移动版
  • win7系统安装程序无法启动
  • js date类型
  • exceltype函数的用法
  • window.open失效
  • Node.js中的construct
  • django发送请求
  • linux bash脚本
  • js异步实现原理
  • jquery动态添加div
  • 云办税大厅
  • 残疾人交房产契税有优惠吗
  • 消费税申报详细流程图
  • 长春国税局科员工资是多少
  • 出口退的增值税怎么算
  • 进口设备需要资质吗
  • 车船税代收有发票吗
  • 电费增值税专用发票如何抵税
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设