表格细边框的CSS样式怎么设置?

html-css014

表格细边框的CSS样式怎么设置?,第1张

指定的<table>为细边框,把<table>放在<div>中即可。

一、首先新建表格,代码如下:

<table width="500" border="1">  <tr><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td></tr><tr><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td></tr><tr>  <td>&nbsp</td><td>&nbsp</td><td>&nbsp</td></tr</table>。

二、在table里加css样式,代码如下:

<table width="500" border="1" cellpadding="0" cellspacing="0" style="border-collapse:collapse">  <tr><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td </tr><tr><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td></tr><tr><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td></table>。

三、单元格边距(表格填充)(cellpadding) -- 代表单元格外面的一个距离,用于隔开单元格与单元格空间。单元格间距(表格间距)(cellspacing) -- 代表表格边框与单元格补白的距离,也是单元格补白之间的距离,border-collapse:collapse表示表格的两边框合并为一条即可。

CSS表格属性用于设置HTML表格的样式,HTML表格由 <table></table> 标签嵌套 <tbody>, <tr>, <td>等标签组成,一个HTML表格默认至少包含table,tbody,tr,td四个元素。

CSS表格属性:

显示表格边框有时候特别重要,它能让表格结构更清晰。

默认的表格有双边框,这是因为表和th/ td元素有独立的边界。border-collapse 属性设置表格的边框是否被折叠成一个单一的边框或隔开。

1.1 内联样式表

在标签中直接添加style 例:<p style=“”> </p>

1.2 内嵌样式表

作为一个独立区域内嵌在网页内,必须卸载head标签内

例:<head>

<style=“”>

</style>

</head>

1.3 外部样式表

即css样式表,需要新建一个css文件,用来放样式表。如果在html文件中调用样式表,需在html文件中点击 右键→CSS样式→附加样式表。(一般用link连接方式)

注:有些标签会有默认的边距,一般写代码的时候会先去除(也可以设置其他需要的样式)

* (对所有标签起作用)

{margin:0px;(边距)

padding:0px;} (间距)