您的位置：首页 > Web前端 > HTML5

html5中不再支持table的cellspacing和cellpadding属性

2014-10-21 10:37 585 查看

html5中不再支持table的cellspacing和cellpadding属性

标签：
javascripthtml5

2014-10-21 10:37
4999人阅读评论(0)
收藏
举报

分类：
HTML/HTML5（11）

作者同类文章X

如果你现在开始用html5的声明来写页面时，你会发现在定义table的cellspacing和cellpadding时被提示该属性已过时或者提示非法属性。具体原因是在html5中table标签的这两个属性已经被移除，需要定义边框之类的时应该使用css的写法。
具体实现如下：

[html]
view plain
copy

print ?

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Html5 Table Test</title>
    <style type="text/css">
        table{ border-collapse:collapse; border:solid 1px Black; }
        table td{ width:50px; height:20px;  border:solid 1px Black; padding:5px;}
    </style>
</head>
<body>
    <table>
        <tr>
            <td></td>
            <td></td>
        </tr>
        <tr>
            <td></td>
            <td></td>
        </tr>
    </table>
</body>
</html>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Html5 Table Test</title>
<style type="text/css">
table{ border-collapse:collapse; border:solid 1px Black; }
table td{ width:50px; height:20px;  border:solid 1px Black; padding:5px;}
</style>
</head>
<body>
<table>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>

效果图如下:

代码的关键点在于border-collapse:collapse; 和 border:solid 1px Black;。对于padding的定义大家都比较熟悉了，这里主要讲一下的是border-collapse中的collapse和separate值，定义为collapse时，他们的边框会重叠在一起，定义为separate时单元格边框之间会有间隙。不定义时默认为separate。 separate情况下的效果图如下：

代码定义很简单，也是早版本浏览器就支持的东西，只是以前我们一些人习惯用cellspacing和cellpadding来定义，但这两个属性在html5中将要移除，所以需要改过来用css来定义而已。很简单的东西，小记一下而已。
转载请注明出处：http://xxling.com/article/76.aspx

顶 2 踩 0

上一篇网页中返回顶部代码(多种方法)另附注释说明

下一篇jquery返回顶部

相关文章推荐

•
HTML5中没有cellspacing和cellpadding怎么办
•
Hadoop生态系统零基础入门
•
table cellpadding属性无效
•
系统集成工程师必过冲刺！
•
border为1px的table 以及 table中cellspacing、cellpadding的css替代写法
•
征服React Native我有妙招
•
html5中不再支持table的cellspacing和cellpadding属性
•
FFmpeg音视频高级开发实战
•
HTML5 AudioVideo 标签,属性,方法,事件
•
5天搞定深度学习框架-Caffe
•
HTML5
•
Python数据分析经典案例解析
•
HTML5可编辑Table
•
HTML5培训技术分享定位属性、列表的高级应用及带有图片列表的网页制作（中）
•
22个HTML5的初级技巧
•
cellspacing和cellpadding的区别

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航