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

摘要:
如果您开始使用html5语句编写页面,您会发现当您定义表的cellspacing和cellpadding时,会提示您该属性已过时或非法。DOCTYPEhtml˃Html5TableTesttable{border-collapse:collapse;border:solid1pxBlack;}桌面{width:50px;height:20px;border:solid1px Black;padding:5px;}˂呈现如下:代码的关键点是边框折叠:折叠;边框:solid1pxBlack;。分离情况下的效果图如下:代码定义非常简单,早期版本的浏览器也支持这一点。然而,我们中的一些人曾经使用cellspacing和cellpadding来定义,但这两个属性将在html5中删除,因此我们需要更改为使用css来定义。注意:在HTML5中,许多标记元素的属性不再存在。以下是html5中每个标记常用的核心属性和语言属性。

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

具体实现如下:

<!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>

效果图如下:

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

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

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

代码定义很简单,也是早版本浏览器就支持的东西,只是以前我们一些人习惯用cellspacing和cellpadding来定义,但这两个属性在html5中将要移除,所以需要改过来用css来定义而已。很简单的东西,小记一下而已。

小记:在html5中,很多标签元素的属性都不复存在了。下面是html5中通用于每个标签的核心属性和语言属性(有个别例外)。

class, contenteditable, contextmenu, dir, draggable, id, 
irrelevant, lang, ref, registrationmark, tabindex, template, title

转载自:http://xxling.com/article/76.aspx

免责声明:文章转载自《html5中不再支持table的cellspacing和cellpadding属性》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇判断视图存不存在快速集成华为AGC云存储服务-Web下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

mysql复制表和表结构

一、CREATE TABLE 方法 整表复制 # create table 新表 select * from 旧表;结构复制 # create table 新表 select * from 旧表 where 1<>1; 二、INSERT INTO 方法 得到建表语句 # show create table 旧表;新建表复制数据到新表 #...

ORACLE 11G 闪回技术(闪回数据库、表、回收站)

ORACLE 11G 闪回技术(闪回数据库、表、回收站) weixin_45389319分类专栏: 数据库 文章标签: 数据库版权闪回数据库就是将数据库回退到过去的一个时间点或scn上,从而实现数据库的恢复,这种恢复不需要通过备份,所以更方便、更快速。该功能不基于撤销数据,而是基于闪回日志。 语法flashback 【standby】 database d...

Sql高级操作

从Table 表中取出第 m 条到第 n 条的记录:(Not In 版本)SELECTTOP n-m+1*FROMTableWHERE (id NOTIN (SELECTTOP m-1 id FROMTable ))  从TABLE表中取出第m到n条记录 (Exists版本)SELECTTOP n-m+1*FROMTABLEAS a WHERENotEx...

SQL 查询所有数据库、表名、表字段总结

SQL Server1、查询所有表    select [id], [name] from [sysobjects] where [type] = 'u' order by [name]2、查询所有数据库    select [name] from [sysdatabases] order by [name]3、查询表中字段     select [nam...

使用engine关键字指定该表使用哪个engine

建表及插入数据语句:mysql> create table salary(userid int,salary decimal(9,2));Query OK, 0 rows affected (0.11 sec)mysql> insert into salary values(1,1000),(2,2000),(3,3000),(4,4000),...

基于HTML5的iPad电子杂志横竖屏自适应方案

基于HTML5的iPad电子杂志横竖屏自适应方案 (转载自:http://www.yeeach.com/?p=1172) 基于HTML5来制作iPad电子杂志,横屏及竖屏自适应是个大问题,查找了半天资料,没有一篇像样的文章可供参考。将思路及例子分享一下。例子并不严谨和规范,仅供参考。 大致思路: 1、对横屏(portrait)和竖屏(landscape)情...