如何用css去除表格内、外边距和边框

Posted 2023-04-27

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何用css去除表格内、外边距和边框相关的知识，希望对你有一定的参考价值。

一般插入表格后，如<table width="959" border="0" cellspacing="0" cellpadding="0">，如何把 cellspacing="0" cellpadding="0"这两项写进css新建的样式表中?
例如：我给<table class="top22"> 则定义这个类为：
.top22 width:970px; height:30px; margin-left:auto; margin-right:auto; border:0px 0px 0px 0px;但后面边距就不懂了，请高手指导！谢谢！

需要准备的材料分别有：电脑、浏览器、html编辑器。

1、首先，打开html编辑器，新建html文件，例如：index.html，编写问题基础代码。

2、在index.html中的<style>标签中，输入css代码：td padding: 0。

3、浏览器运行index.html页面，此时成功用css去除了表格的边框和边距。

参考技术A

1、新建一个html文件，命名为test.html。

2、在test.html文件内，使用table标签创建一个两行两列的表格用于测试讲解。

3、在test.html文件内，设置table表格的id为mytb，主要用于下面通过该id设置表格的样式。

4、在test.html文件内，编写<style type="text/css"></style>标签，页面的css样式将写在该标签内。

5、在css标签内，通过table的id和td元素名称设置td单元格的样式，使用padding属性设置单元格的内边距为20px。

参考技术B cellspacing="0" cellpadding="0"为html中为table定义的属性,在CSS中没有.
cellpadding 对应 padding
cellspacing 对应 margin

举例：

cellpadding＝0
等同于CSS中对TABLE定义为：
table padding:0;

而在CSS中border属性中分别有4个0px,中间用空格间隔,这4个数值分别代表上,右,下,左.顺序不能变.这4个数值可以不一样.有时候border后面只有一个数字,两个数字,三个数字.这就要类推了.
比如border:1px;那么他就定义的是上边距为1个像素.而没有右,下,左咋个办呢?并不是没有就为0,而是根据没有定义左,那么左就和右一样,没有定义下,就和上一样,没有定义右,那右就和上一样.
上面的例子就可以等价为:border:1px 1px;也等价border:1px 1px 1px;还等价border:1px 1px 1px 1px;
再比如border:1px 2px;就是说上,下边距为1px;右,左边距为2px;所以他等价border:1px 2px 1px 2px;
一定要记住顺序为上右下左.

网上还有一种修改cellSpacing的方法.你可以试下Table jerry:expression(cellSpacing="1");
不过只在IE中有用,FF中没用本回答被提问者采纳参考技术C 在样式中设置：
border:none; 
margin:none; 
line-height:20px; 
padding:0px;  参考技术D .top22margin:0;/*外边距*/padding:0;/*内填充*/width:970px; height:30px;border:0;