为表格设置合并边框模型：

最新推荐文章于 2022-04-07 19:55:53 发布
最新推荐文章于 2022-04-07 19:55:53 发布
阅读量1k 收藏
点赞数
分类专栏： HTML5.CSS3
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hunannanhu/article/details/45598835
版权 
table
  {
  border-collapse:collapse;
  }

定义和用法

border-collapse 属性设置表格的边框是否被合并为一个单一的边框，还是象在标准的 HTML 中那样分开显示。

默认值：separate

继承性：yes

版本：CSS2

JavaScript 语法：object.style.borderCollapse="collapse"

可能的值

值 描述
separate 默认值。边框会被分开。不会忽略 border-spacing 和 empty-cells 属性。
collapse 如果可能，边框会合并为一个单一的边框。会忽略 border-spacing 和 empty-cells 属性。
inherit 规定应该从父元素继承 border-collapse 属性的值。

<style type="text/css">
table
  {
  border-collapse:collapse;
  }


table, td, th
  {
  border:1px solid black;
  }
</style>
</head>


<body>
<table>
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr>
<td>Bill</td>
<td>Gates</td>
</tr>
<tr>
<td>Steven</td>
<td>Jobs</td>
</tr>
</table>

效果



飞向Hadoop
关注
专栏目录
CSS（深入研究合并外边距collapse）
APieceOfBullshit
07-25 604
合并外边距 CSS中，两个或多个盒（可能但不一定是兄弟）的相邻的垂直方向的margin会被结合成一个margin。外边距按这种方式结合叫做合并（collapse） 1、相邻的垂直外边距会合并，除了 html和body的外边距不合并 图一 元素如果带有clear属性（生成间隙clearance），上外边距与下外边距相邻（height为0），那么它的外边距会和兄弟的相邻外边距合并，但合并后的m...
IDEA太强悍了！java导出excel合并单元格边框设置
m0_57699613的博客
05-12 1079
前言 又到一年金九银十之际。 Java作为目前用户最多，使用范围最广的软件开发技术之一。 Java的技术体系主要由支撑Java程序运行的虚拟机，提供各开发领域接口支持的Java,Java编程语言及许多第三方Jvav框架构成。 其中，以Java的虚拟器为今天的着重点 以下是我整理收藏的一些JVM大厂面试经典问题与相应答案，希望可以给看文的朋友一些帮助 由于篇幅过长，请耐心往下看，文末提供小编收藏已久的JVM面试宝典！ 基于 Servlet 容器的 Web MVC 身为 Java 开发者，对于 Spring
CSS border-collapse 属性
AllinShang的专栏
05-02 951
border-collapse 属性设置表格的边框是否被合并为一个单一的边框，还是象在标准的 HTML 中那样分开显示。 默认值：    separate 实例 为表格设置合并边框模型： table   {   border-collapse:collapse;   } 所有主流浏览器都支持 border-collapse 属性。 separa
表格中border-collapse属性
weixin_30394251的博客
01-19 279
页面制作中最头痛的，表格的边框算是其一了。一不小心就会出现双重线 border-collapse属性 很好的解决了纠结了很久的问题 .table{border: 1px solid #ccc;border-collapse: collapse; width:80%;}.table th,.table td{border: 1px solid #ccc;padding: 10px;} ...
css border-collapse
04-22 981
css 中border-collapse,css 中可以这样写 table { border-collapse:collapse; }
微信小程序表格合并demo
最新发布
11-21
在表格合并的场景下，你可能需要用到CSS的`display: table`、`display: table-cell`等属性来布局表格，同时设置单元格的宽度、高度以及边框等样式。对于合并的单元格，可能需要设置特殊的样式，比如隐藏不需要显示的...
用CSS样式描述表格Table边框
12-11
在表格行为方面，`border-collapse: separate`使用了独立边框模型，允许设置`border-spacing`来调整单元格之间的空间。根据W3C的规则，边框冲突的处理涉及到边框的可见性、样式和宽度。隐藏边框优先级最高，无样式...
CSS如何修改tr边框属性实例详解
01-19
比如tr的边框。如果我们按照如下的形式修改tr的属性就大错特错了. 复制代码代码如下: tr{ border:1px solid #... 实例：为表格设置合并边框模型： 复制代码代码如下: table{ border-collapse:collapse; } 参数： sep
CSS: border-collapse 属性
weixin_33682719的博客
03-08 479
摘自：http://www.w3school.com.cn/css/pr_tab_border-collapse.asp 定义和用法 border-collapse 属性设置表格的边框是否被合并为一个单一的边框，还是象在标准的 HTML 中那样分开显示。 默认值： separate 继承性： yes 版本： CSS2 JavaScript 语法： obj...
CSS样式表中 border-collapse 的属性
chaonanwo的专栏
05-22 2584
CSS样式表中 border-collapse 属性是用来设置 table 表格的边框是否被合并为一个单一的边框，还是象在标准的 HTML 中那样分开显示。 目前所有主流浏览器都支持 border-collapse 属性。 border-collapse 属性值： border-collapse:collapse; 边框会合并为一个单一的边框。会忽略 border-spacing 和 emp
表格中的border-collapse属性
lyclyc_的博客
06-27 1253
border-collapse：collapse;相邻边被合并 border-collapse:separate;边框独立
table中设置border-collapse属性
Dandan的前端开发---专注于div css js jquery
04-23 2234
CSS border-collapse 属性 定义和用法 border-collapse 属性设置表格的边框是否被合并为一个单一的边框，还是象在标准的 HTML 中那样分开显示 浏览器支持 所有主流浏览器都支持 border-collapse 属性。 注释：任何的版本的 Internet Explorer （包括 IE8）都不支持属性值 "inherit"。 注释：如果没有规定
CSS系列之表格边框 border-collapse
老__L的博客
01-25 8444
本文主要介绍CSS的border-collapse属性。表格边框 border-collapse
position属性和border-collpase属性
nizhengjia的专栏
11-26 384
1.border-collapse属性 该属性表示折叠边框。是设置表格的行或之间是否留有距离的样式。有3个默认值：separate|collapse|inherit separate:默认值。边框会被分开。不会忽略 border-spacing 和 empty-cells 属性。 collapse:如果可能，边框会合并为一个单一的边框。会忽略 border-spacing 和 empty-cell...
html中collapse代码怎么写,如何使用CSS中的border-collapse属性
weixin_31556767的博客
05-30 2348
CSS中的border-collapse属性是用来设置表格边框是否合并，它有三个值其中separate表示分离边框，collapse表示合并边框，inherit 表示从父级那继承属性在制作表格的时候我们可以通过border-collapse 属性来使两个边框合并为一个，使得边框效果更加美观，今天将要介绍如何使用border-collapse 属性以及它的两个值的区别【推荐课程：CSS教程】bord...
CSS基础-05-表格（表格边框、 折叠边框 border-collapse、水平对齐 text-align、垂直对齐 vertical-align 、表格填充 padding）
运维玄德公
04-07 4689
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）...
css之border-collapse属性
Focus-Fe
02-07 244
CSS border-collapse 属性       ---------设置表格的边框是否被合并为一个单一的边框，还是像在标准的HTML中那样分开显示。   默认值： separate 继承性： yes 版本： CSS2 JavaScript 语法： object.style.borderCollapse="collapse"   ...
html设置tr无上边框,【html】设置tr边框
weixin_39839478的博客
06-19 1324
因为表格中的tr并非单一的边框，这样便需要属性border-collapse，border-collapse 属性设置表格的边框是否被合并为一个单一的边框，还是象在标准的 HTML 中那样分开显示。设置边框-webkit-appearance: none;border:1px solid #BBBBBB;框线制作常用代码代码含义...建立表格，所有的其他标记...DOCTYPE html PUBL...
Table样式设置与自适应详解：溢出处理与边框合并
` 这个CSS属性用于设置表格的边框合并模型，使得相邻单元格的边框合并成一条边框，减少了边框之间的间隙，使得表格看起来更加紧凑。 - `border-spacing: 0;` 该属性用于设置表格单元格之间的间距，将其设置为0可以...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值