第一个第二个第一个第二个

cellspacing和cellpadding学习

系统 2076 0

cell指表格的内容
cellspaceing:表格里单元格之间的距离(类似div margin 外补丁)
cellpadding:表格里单元格空白部分(类似div padding 内补丁)

  cellspacing和cellpadding学习

      <html>
	<head>
	
	</head>
	<body>
		<table border="1" cellspacing="10px" cellpadding="20px">
			<tr>
				<td>第一个</td>
				<td>第二个</td>
			</tr>
			<tr>
				<td>第一个</td>
				<td>第二个</td>
			</tr>
		</table>
			
		
	</body>
</html>
    

 

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

separate:分开,默认

collapse:合并,cellspacing和cellpadding样式失效

      <!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=gb2312" />
<meta http-equiv="Content-Language" content="zh-cn" />

<meta name="robots" content="all" />

<meta name="author" content="w3school.com.cn" />
<meta name="Copyright" content="Copyright W3school.com.cn All Rights Reserved." />
<meta name="MSSmartTagsPreventParsing" content="true" />
<meta http-equiv="imagetoolbar" content="false" />

<link rel="stylesheet" type="text/css" href="/c3.css" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />

<title>CSS border-collapse 属性</title>
</head>

<body class="html">
<table style="border-collapse:collapse" border="1" width="200" cellspacing="30">
	<tr>
		<td>11</td>
		<td>12</td>
		<td>13</td>
	<tr>
	<tr>
		<td>21</td>
		<td>22</td>
		<td>23</td>
	<tr>
</table>

<table style="border-collapse:separate" border="1" width="200" cellspacing="30">
	<tr>
		<td>11</td>
		<td>12</td>
		<td>13</td>
	<tr>
	<tr>
		<td>21</td>
		<td>22</td>
		<td>23</td>
	<tr>
</table>
</body>
    

 

 备注: <!DOCTYPE 不能少,否则看不到效果

cellspacing和cellpadding学习


更多文章、技术交流、商务合作、联系博主

微信扫码或搜索:z360901061

微信扫一扫加我为好友

QQ号联系: 360901061

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描下面二维码支持博主2元、5元、10元、20元等您想捐的金额吧,狠狠点击下面给点支持吧,站长非常感激您!手机微信长按不能支付解决办法:请将微信支付二维码保存到相册,切换到微信,然后点击微信右上角扫一扫功能,选择支付二维码完成支付。

【本文对您有帮助就好】

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描上面二维码支持博主2元、5元、10元、自定义金额等您想捐的金额吧,站长会非常 感谢您的哦!!!

发表我的评论
最新评论 总共0条评论