html5中不在支持cellpadding属性
2015-08-03 09:16
567 查看
如果你现在开始用html5的声明来写页面时,你会发现在定义table的cellspacing和cellpadding时被提示该属性已过时或者提示非法属性。具体原因是在html5中table标签的这两个属性已经被移除,需要定义边框之类的时应该使用css的写法。
具体实现如下:
-收缩代码
效果图如下:
代码的关键点在于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
具体实现如下:
-收缩代码
<!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
相关文章推荐
- 5个超棒的HTML5框架
- HT for Web基础动画介绍
- 01_MUI之Boilerplate中:HTML5示例,动态组件,自定义字体示例,自定义字体示例,图标字体示例
- 01_MUI之Boilerplate中:HTML5示例,动态组件,自定义字体示例,自定义字体示例,图标字体示例
- HTML5 Canvas实现web画图之自由绘制矩形
- HTML5 Canvas实现web画图之自由画笔
- 在移动HTML5页面input类型采用number无法控制长度,以及右边显示难看的加减按钮
- 如何让浏览器支持HTML5标签
- HTML5文件API
- 3、H5+初始化
- HTML5
- html5+css3 快速学习
- HTML5 Boilerplate
- HTML5头部标签备忘
- 【阅读】《head first html5》第九章——在本地存储
- Java EE HTML5 WebSocket 示例
- 【实例】html5中使用localStorage实现简易的便利贴网页
- HTML5实现屏幕手势解锁(转载)
- 用H5的canvas做时钟
- HTML5 – 4.canvas