html5中cellpadding和cellspacing属性不被支持，用css border-collapse:collapse来代替

最新推荐文章于 2022-11-11 16:39:38 发布
最新推荐文章于 2022-11-11 16:39:38 发布
阅读量2.7k 收藏
点赞数
分类专栏： HTML CSS 文章标签： css html5
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u012698341/article/details/20297757
版权

直接上代码，蓝字重点。

1》》》》》》HTML5+CSS版

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type = "text/css">
table{
width:100%;
border-collapse:collapse;
height:200px;
}
td{
border:1px solid red;
width:20%;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>演示</title>
</head>
<body>
<table>
<caption>这是表格标题</caption>
    <tr>
    <td colspan="5"></td>
    </tr>
    <tr>
    <td rowspan="2"></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr>
    <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
</table>
</body>

</html>

2》》》》》HTML4版

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>


<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>演示</title>
</head>


<body>
<table border="1" width="100%" height="200px"cellpadding="0" cellspacing="0">
<caption>这是表格标题</caption>
    <tr>
    <td colspan="5"></td>
    </tr>
    <tr>
    <td rowspan="2"></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr>
    <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
</table>
</body>
</html>


eternityl
关注
专栏目录
表单，表格，列表
qq_45852515的博客
04-09 271
每个表格由 table 标签开始,表示一个表格 每行由tr开始 每行中的元素由th或td开始 thead语义标签,表示表格的头部 tbody语义标签,表示表格的底部 <table border='边框线的宽度' align='表格在页面中的对齐方式' bgcolor='表格的背景色' background='背景图片'> 这些标签已不支持使用 应该使用css相关指定样式指定样式 格在页面中的对齐方式 使用margin来控制对齐反式 bgcolor='表格的背景色 使用backgrou
html5 collapse,关于css中的border-collapse
weixin_39732716的博客
06-22 384
这个属性以前并没有怎么接触过，该属性有两种1取值:separate 和 collapse取值的含义具体如下：separate：边框独立collapse：相邻边被合并举例如下：border-collapse.separate{border-collapse: separate;}.collapse{border-collapse: collapse;}onetwothreeonetwothree最后...
什么取代了HTML5表格中的cellpadding，cellspacing，valign和align？
CHCH998的博客
07-02 646
In Visual Studio , I'm seeing these warnings: 在Visual Studio中 ，我看到这些警告： Validation (HTML 5):
在html5中不支持<table>的cellpadding 和 cellspacing的替代方案
Quincylk的专栏
08-21 8453
原文：https://www.cnblogs.com/cbza/p/7147214.html 在html5中不支持&lt;table&gt;的cellpadding 和 cellspacing ; 2) 如何用css实现 cellpadding, cellspacing ; 3) tr , th 是 有 border, 没有 padding 的. 1.初始: ​​​​&lt;!DOCTYP...
html中collapse代码怎么写,CSS里的visibility属性有个鲜为人知的属性值：collapse
weixin_29940495的博客
05-30 575
虽然CSS并不是一种很复杂的技术，但就算你是一个使用CSS多年的高手，仍然会有很多CSS用法/属性/属性值你从来没使用过，甚至从来没听说过。对于CSS里的visibility属性，相信你用过不下几百次。大多时候，你会把它的值设置成visible(这是所有页面元素的缺省值)，或者是hidden。后者相当于display: none，但仍然占用页面空间。其实visibility可以有第三种值，就是co...
html样式类collapse,[ CSS-CSS3 ] 史上最全CSS样式一览表
weixin_39980002的博客
06-22 624
CSS样式一览表CSS样式CSS添加方法CSS添加方法—行内 段落文字 CSS添加方法—内嵌样式p{color:red; /*设置字体颜色*/}CSS添加方法—外部样式表1.多重样式可以层叠，可以覆盖2.样式的优先级按照“就近原则”:行内样式> 内嵌样式> 链接样式>浏览器默认样式CSS选择器标签选择器 ph1 {font:“黑体";font-size:20px;}p {colo...
HTML cellpadding与cellspacing属性图文详解
09-28
例如，可以使用`padding`属性替换`cellpadding`，使用`border-collapse`和`border-spacing`属性替换`cellspacing`。`border-collapse`用于决定单元格边框是否合并，`border-spacing`则用来设置单元格之间的间距。 ...
cellpadding=0 cellspacing=0的css替代写法
01-19
在HTML4.01和XHTML中，`cellspacing`和`cellpadding`属性被直接写在`<table>`标签内，但在HTML5标准中，这些属性已经不再被推荐使用，取而代之的是通过CSS来控制这些布局细节。 `border-collapse: collapse;`是CSS...
IE6/7中使用setAttribute设置table的cellpadding和cellspacing的Bug
09-25
在CSS中，可以使用`border-collapse`、`border-spacing`、以及`padding`属性来实现类似的效果，这是更推荐的现代做法，因为它们提供了更好的样式控制和浏览器兼容性。 在IE6/7中，如果尝试使用JavaScript的`...
html cellpadding属性,HTML <table>标签 cellpadding 属性
weixin_42509267的博客
06-10 713
HTML 标签 cellpadding 属性定义和用法HTML5 不支持 cellpadding 属性。请使用 CSS 代替。cellpadding 属性规定单元边沿与单元内容之间的空间，以像素计。注意：请勿将该属性与cellspacing属性相混淆，cellspacing 属性规定的是单元之间的空间。提示：从实用角度出发，最好不要规定 cellpadding，而是使用 CSS 来添加pa...
html中collapse代码怎么写,HTML Style borderCollapse用法及代码示例
weixin_36212240的博客
05-30 2257
HTML中的DOM样式borderCollapse属性用于设置或返回折叠为单个边框的表的边框。用法:它用于返回borderCollapse属性。object.style.borderCollapse它用于设置borderCollapse属性。object.style.borderCollapse = "separate|collapse|initial|inherit"返回值：它返回一个代表表格边...
border-collapse: collapse；和cellspacing=“0“有什么区别呢？
最新发布
阿珂学cv
11-11 652
从以上定义可以看出，border-collapse实现一个边框的合并问题，也就是相邻边框会变成一条边框显示。而，cellspacing只能定义相邻边框之间的间距，也就是说两条边框还独立存在，并未合并为一条边框。CSS属性，用来决定表格的边框是分开的还是合并的。在分隔模式下，相邻的单元格都拥有独立的边框。在合并模式下，相邻单元格共享边框。cellspacing 属性规定单元格之间的空间。
html collapse不重叠,collapse还是没理解。
weixin_29094979的博客
05-31 195
如果把参数 toStart 设置为 true，该方法将把范围的结束点设置为与开始点相同的值。否则，它将把范围的开始点设置为与结束点相同的值。没有false，不设置就行了。——谁的开始点，谁的结束点。var rangeObj=document.createRange();function selectRC(){var d=document.getElementById("myDiv");rangeO...
亲爱的老狼-论cellspacing和collapse的区别
m0_60450677的博客
08-18 260
cellspacing是作用是在表格里将表格线之间的间距合并，形成一整条线，增强美观度。 collapse的作用和cellspacing的作用是一样的，只是collapse是作用于css里。 一个是表格专用，一个是盒子专用。
html中collapse代码怎么写,CSS 面试题: 手写 collapse(折叠) 的 css/html 部分
weixin_30899991的博客
05-30 410
注意根据@_小白_的建议,用input配合伪类实现效果更好, 我实现了一下, 但是在微信小程序不好使(微信的input标签的type不支持值为checkbox或radio), 所以暂时这个阶段, 处于对多端的支持, 还是推荐大家用js来控制"开/合"动作, 查看无需js版本做一个组件库不难其实vue/react等框架的出现, 让自己做一个ui变得简单, 大部分的js逻辑都被库封装, 反而组件的代码...
html中collapse代码怎么写,如何使用CSS中的border-collapse属性
weixin_31556767的博客
05-30 2348
CSS中的border-collapse属性是用来设置表格边框是否合并，它有三个值其中separate表示分离边框，collapse表示合并边框，inherit 表示从父级那继承属性在制作表格的时候我们可以通过border-collapse 属性来使两个边框合并为一个，使得边框效果更加美观，今天将要介绍如何使用border-collapse 属性以及它的两个值的区别【推荐课程：CSS教程】bord...
css border-collapse:collapse解决表格tr边框无效的问题
qq_42112846的博客
12-11 5531
今天写了一个表格，并将表格的tr设置了边框样式border-bottom: 1px #ccc dashed;但这个css样式貌似没有取到任何作用，先让大家看一下我的html css代码 <table> <tr style="border-bottom: 1px #ccc dashed;"> <td height="30" width="75">标题...
Html5-如何正确给table加边框
菲菲的博客
03-04 1万+
Html5-如何正确给table加边框分析单个属性的效果一、表格边框 border="1"二、cellspacing单元格间距三、cellpadding单元格边距四、去掉表格中table的所有属性值，在css中给table设置五、border-collapse: collapse 边框合并六、分析差别七、分析误区总结一下：Html中table的属性:总结来说，给表格加边框，有两种方式：【注意】 分...
html中cellpadding属性作用,table标签cellpadding属性的作用及使用方法
热门推荐
weixin_29290379的博客
06-05 1万+
在html中制作表格，需要用到table标签，而该标签中的cellpadding属性可设置单元格边距大小，下面我们就一起学习一下cellpadding属性的作用及使用方法。标签cellpadding属性定义和用法cellpadding属性指定单元格边框和单元格内容之间的空白部分(以像素为单位)。HTML5中不支持的cellpadding属性，请使用CSS样式的padding(内边距)设置单元格边距...
CSS3新特性：多颜色边框属性详解与应用
- **表格**：`border-collapse`控制表格边框是否合并，`cellspacing`和`cellpadding`调整单元格间距。 - **CSS轮廓**：`outline`属性用于定义元素的轮廓，不同于边框，轮廓不占据空间。 - **浮动元素**：`float`属性...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值