本文和大家重点讨论一下用CSS来表示表格的cellpadding和cellspacing方法,表格的cellpadding和cellspacing我们经常会用一定的方式来清除默认样式,请看下文详细介绍。

用CSS来表示表格的cellpadding和cellspacing方法

表格的cellpadding和cellspacing我们经常会用如下的方式来清除默认样式:

引用

  1. <tablecellspacingtablecellspacing="0"cellpadding="0"></table>

很多朋友会说表现在结构中,这样不符合标准,那如何将这个表现拿出来,有些朋友或许很迷惑。我们可以用table的border-collapse:collapse;属性来代替cellspacing="0",用th,td的padding:0;属性来代替cellpadding="0"。

引用

  1. table{
  2. border-collapse:collapse;
  3. border-spacing:0;
  4. }
  5. th,td{
  6. padding:0;
  7. }

还可以用expression来实现cellpadding="0"的样式:

引用

  1. table{
  2. border-collapse:collapse;
  3. border-spacing:0;
  4. padd:expression(this.cellPadding=0);
  5. }

我们看下《HTML与CSS入门经典(第7版)》一书中对这两个属性的描述:

引用

对表格的设置不仅可以使用style属性。例如,可用cellpadding和cellspacing属性来控制表格边框的间距。cellspacing属性设置表格边框之间和表格单元格之间的间距(以像素为单位);cellpadding属性设置单元格中的信息四周的间距(也是以像素为单位)。如果将cellpadding属性设置为0,将使表格中的所有信息尽量接近表格边框,甚至接触到边框。cellpadding和cellspacing属性让你能够全面控制表格的外观。

注意:虽然在XHTML中仍允许使用cellpadding和cellspacing属性,但CSS中存在与这两个属性等价的样式属性padding和border-spacing。然而,当前的网页浏览器对这些样式属性的支持不一致,因此建议现在仍使用属性cellpadding和cellspacing来调整表格的间距。
而《精通CSS》一书中,作者提倡的方法是:

引用

    1. table{
    2. border-collapse:collapse;
    3. }
    4. <tablecellpaddingtablecellpadding="0"></table>

CSS中表示cellpadding和cellspacing的方法的更多相关文章

  1. CSS中隐藏内容的3种方法及属性值

    CSS中隐藏内容的3种方法及属性值 (2011-02-11 13:33:59)   在制作网页时,隐藏内容也是一种比较常用的手法,它的作用一般有:隐藏文本/图片.隐藏链接.隐藏超出范围的内容.隐藏弹出 ...

  2. CSS中隐藏内容的3种方法

    CSS中隐藏内容的3种方法 一般有:隐藏文本/图片.隐藏链接.隐藏超出范围的内容.隐藏弹出层.隐藏滚动条.清除错位和浮动等. 1.使用display:none来隐藏所有内容 display:none可 ...

  3. css中的float属性以及清除方法 (2011-09-03 17:36:26)

    CSS里面的浮动属性是布局的常用工具,只有真正了解它并熟练使用才能将它的优点发挥到极致. 许多页面中都有文字绕图效果,并且各区块分布得错落有置,很多朋友在自学CSS布局时为了做出这些效果往往会被div ...

  4. CSS中元素水平居中和垂直居中的方法

    #CSS中水平居中和垂直居中的方法 一. 水平居中 1.行内元素(文本,图片等) 如果被设置元素为文本.图片等行内元素时,可以通过给父元素设置` text-align:center;` 来实现 2.定 ...

  5. css中常用的几种居中方法

    在前端面试中,大都会问你div居中的方法: 文笔不好,就随便寥寥几句话概括了, 不过以后文笔肯定会变得更好一些的. 今天我们就细数一下几种方法: 1,使用position:absolute,设置lef ...

  6. css中元素水平垂直居中4种方法介绍

    table-cell轻松设置文本图片水平垂直居中 让一个元素垂直居中的思路:把这个元素的容器设置为table-cell,也就是具有表格单元格的特性,再使用vertical-align(这个属性对blo ...

  7. css中设置div垂直水平居中的方法

    设置要水平垂直居中的div的position为absolute,left:50%;margin-left为负的这个元素宽度的一半,同理,top:50%;margin-top为负的这个元素的高度的一半. ...

  8. css中让元素隐藏的多种方法

    { display: none; /* 不占据空间,无法点击 / } { visibility: hidden; / 占据空间,无法点击 / } { position: absolute; top: ...

  9. CSS中表示颜色的4种方法

    #1:直接用颜色名称 #2:十六进制数 #3:RGB整数设置颜色 0-255 #4:RGB百分数设置颜色0%-100%

随机推荐

  1. 快学Scala第一部分

    转载: 1.变量声明 val answer = 8 * 5 + 2; //常量 var counter = 0;    //变量 //在必要的时候 ,可以指定类型 val greeting:Strin ...

  2. java学习之二维数组

    java当中的二维数组,存储一组比较特殊的对象.他存储一个数组,同时存储的数组当中又存储着元素. java二维数组的声明方式一: class Arr2Demo { public static void ...

  3. Sublime Text 3 配置

    配置: { "font_face": "Source Code Pro", , "highlight_line": true, " ...

  4. bzoj3280

    bzoj1221的变形版本,弄懂1221,这题还是很简单的 ; type node=record        point,next,flow,cost:longint;      end; ..] ...

  5. WordPress BuddyPress Extended Friendship Request插件跨站脚本漏洞

    漏洞名称: WordPress BuddyPress Extended Friendship Request插件跨站脚本漏洞 CNNVD编号: CNNVD-201307-609 发布时间: 2013- ...

  6. UVA-10735 - Euler Circuit(混合欧拉回路输出)

    题意:给你一个图,有N个点,M条边,这M条边有的是单向的,有的是双向的. 问你能否找出一条欧拉回路,使得每条边都只经过一次! 分析: 下面转自别人的题解: 把该图的无向边随便定向,然后计算每个点的入度 ...

  7. WPF之插件开发

    一:解决方案管理器截图 效果图: 二:简单功能说明 IMsg定义了一个接口,MYPlugin1实现接口功能,”插件式开发“实现程序运行时再调用非本身引用的dll文件,调用该dll的方法实现功能 三:I ...

  8. Delphi 为TClientdataset定义结果集,并增加记录

    Delphi 为TClientdataset定义结果集,并增加记录 procedure addDefsFieldsForCDS(aDataSet: TClientDataSet);begin  aDa ...

  9. Java---对象与类的封装

    一.类和对象: package cn.hncu.Myclasslearn; /** * * @author hncu_chx * * Mylove amin */ /**类是一种数据类型,声明一个类就 ...

  10. 数学概念——G 最大公约数

    G - 数论,最大公约数 Time Limit:1000MS     Memory Limit:32768KB     64bit IO Format:%I64d & %I64u Submit ...