table中border-collapse的问题

最新推荐文章于 2022-10-25 16:38:54 发布
最新推荐文章于 2022-10-25 16:38:54 发布
阅读量2.3k 收藏
点赞数
原文链接：http://www.cnblogs.com/zhaobao1830/p/9834046.html
版权

在table中，如果设置了border-collapse: collapse;，边框会合并，这时你修改top或bottom的颜色，会有问题

解决办法是：border-collapse: separate;  border-spacing: 0;  这样就可以设置边框的颜色了

转载于:https://www.cnblogs.com/zhaobao1830/p/9834046.html

aiguai2216
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
记录一个css border-collapse: collapse的小坑
lzhlzhlzh_lzh的博客
10-25 138
查了一下说是border-collapse: collapse;与 border-radius;会有冲突，把border-collapse: collapse;然后把table里面的代码一行一行试，终于发现了，原来是border-collapse: collapse;另一个问题是如下图会出现不知道哪来的间隔，同样把border-collapse: collapse;可以看到最终效果是表格的边框没有圆角，找了很久不知道是什么问题，这段代码是加在table中的。希望实现简单的圆角边框效果；
table中的border-collapse属性
04-14
border属性 border-collapse属性
table border-collapse 的属性
蚁族的奋斗的博客
05-11 1808
border-collapse 的属性 设置表格的边框是否被合并为一个单一的边框，还是象在标准的 HTML 中那样分开显示。 和cellspacing 的区别在于cellspacing 只是td和td 之间没有间距了，但是边框是2px； border-collapse 的作用不仅td 之间没有间距，而且边框是1px； ...
Table的border-collapse属性
深海狂鲨
08-25 4472
separate :　 默认值。边框独立（标准HTML） collapse :　 相邻边被合并该属性是设置表格的行和单元格的边是合并在一起还是按照标准的HTML样式分开。 1.table border为0，td border为1时是如下所示(假设2×2) 口口 口口 2.table border为1，td border为1时为上图最外框加个边框 3.table {border-collapse:c
html表格边框设置单线,border-collapse把table边框的样式设置成单线
weixin_39622980的博客
06-15 5214
table 默认的情况，如果给单元格，添加边框的时候。每个边框都会有自己的边框。这样看上去就出现了，类似的双边框情况。看上去一点也不美观，还是把边框设置成单线的时候，比较美观。table中有个border-collapse属性，就是用来合并边框的。防止出现“双边框的情况。collapse的本意就有折叠的含义，首先给出一个示例的效果。没有把边框设置成单线的效果border-collapse 没有合...
CSS系列之表格边框 border-collapse
老__L的博客
01-25 8256
本文主要介绍CSS的border-collapse属性。表格边框 border-collapse
一个属性border-collapse解决Table的边框问题
09-25
表格的边框算是页面制作中最头痛的，带边线的表格在之前非常讨厌做，不过今天终于解决了这个问题，下面将示例与大家分享下
gridview生成时如何去掉style属性中的border-collapse
09-04
在默认情况下，GridView在生成HTML代码时，会添加`border-collapse: collapse`到其`<table>`元素的`style`属性中，这会导致表格的边框合并，使得表格看起来更加紧凑。然而，有时我们可能希望自定义表格的样式，或者...
给table的tr添加border-top时没有效果的解决方法
12-09
在网页设计中，我们经常需要对表格（table）进行样式设置，其中，为表格行（tr）添加边框（border）是一种常见的需求。然而，在实际操作中，有时你会发现为`<tr>`元素直接添加`border-top`属性并没有预期的效果，这...
Table border-collapse: collapse下td边框渲染机制
zc1121667599的博客
10-25 298
Table border-collapse: collapse下td边框渲染机制
table中设置border-collapse属性
Dandan的前端开发---专注于div css js jquery
04-23 2215
CSS border-collapse 属性 定义和用法 border-collapse 属性设置表格的边框是否被合并为一个单一的边框，还是象在标准的 HTML 中那样分开显示 浏览器支持 所有主流浏览器都支持 border-collapse 属性。 注释：任何的版本的 Internet Explorer （包括 IE8）都不支持属性值 "inherit"。 注释：如果没有规定
table的border-collapse属性
Mr.Ren的专栏
08-11 1346
table的css样式
HTML画表格table边线重合问题（border-collapse: collapse；）
黄彪博客
12-03 7858
文章目录一、参考问题描述解决思路一、使用DIV + CSS二、使用table border-collapse案例 一、参考 CSS border-collapse 属性 问题描述 工作中，需要画一个表格，需要显示border,于是使用DIV+CSS的方式，如果设置“border: 1px solid red”的样式，结果div重合的地方就会出现2倍的边线，与设计不符 解决思路 一、使用DIV + CSS 如果一定要使用DIV+CSS, 则需要区分第一行 、 最后一行 、第一列、最后一列 、中间表格的
css两个边框横合并,CSS属性 table 的 border-collapse 边框合并
weixin_39759441的博客
08-03 3501
说明该CSS属性用来设定表格的行和列的边框是合并成单边框，还是分别有各自的边框separate 缺省值。边框分开，不合并。collapse 边框合并。即如果相邻，则共用同一个边框。虽然在DIV+CSS 时代 table 的权重越来越低，但是有时候，还是局部地方table 还是挺好用的特别是制表方面，还是table 比较的方便。当然，制表肯定少不了边框，但是如果你直接在td上加边框，就会出现一种情况...
CSS基础-05-表格（表格边框、 折叠边框 border-collapse、水平对齐 text-align、垂直对齐 vertical-align 、表格填充 padding）
运维玄德公
04-07 4546
1. 边框（border） 1.1 添加边框 示例（table 边框） 示例（th边框） 示例（td 边框） 1.2 折叠边框（border-collapse） 2. 高度和宽度（width/height） 示例（表头高度设置为百分比） 3. 对齐 3.1 水平对齐（text-align） 3.2 垂直对齐（vertical-align） 4. 表格填充（padding）...
深入table之collapse
Jone_wan的专栏
03-22 2366
table嵌套table深入剖析border-collapse： （最下面的一行为嵌套的table） collapse: 分析：tr的宽度不等于table的宽度，而是table-trboder/2,因此tr下再嵌table，不能保证与上面的table宽度一致，所以无论怎么设置都是无法对齐的。 separate: 分析：tr长度与table一样长，因此tr嵌table的宽度也能保证与table的长度一致。 border-collapse的...
关于table边框，设置了border-collapse:collapse之后，各条边框是怎么合并的？
qq_39941521的博客
09-22 3504
关于table边框，设置了border-collapse:collapse之后，各条边框是怎么合并的？ 遇到一个边框需要设置圆角的，然后发现在设置了border-collapse:collapse之后，border-radius:5px就不起作用了，就各种查证，发现这个是css本身就存在的，两者不能混在一起使用。所以使用了其他的方式，实现了table的圆角。 但是现在就很想知道，tab
css border-collapse:collapse解决表格tr边框无效的问题
qq_42112846的博客
12-11 5457
今天写了一个表格，并将表格的tr设置了边框样式border-bottom: 1px #ccc dashed;但这个css样式貌似没有取到任何作用，先让大家看一下我的html css代码 <table> <tr style="border-bottom: 1px #ccc dashed;"> <td height="30" width="75">标题...
.table { border-collapse: collapse; }
最新发布
07-14
其中，border-collapse: collapse; 表示单元格之间没有边框；mso-data-placement: same-cell; 是用于定义在Microsoft Word等邮件客户端中，换行符的处理方式；tr { height: 21px; } 定义表格行的高度为21像素；td {}...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值