`
mrzhangtufu
  • 浏览: 61952 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

css 控制表格属性

    博客分类:
  • jsp
阅读更多

cellpadding 可換成 CSS 設定 td 標籤的 padding

cellspacing 則可換成 CSS 設定 table 邊簽的 border-spacing

align=center换成 text-align:center

 

我们做WEB程序开发过程中,经常会为了Table中的cellSpacing,cellpadding等样式的设置发愁,经常没有办法可想了,就会直接在Table中设置cellSpacing,cellpadding了,这样以后要改页面风格时,或做多主题风格时,就会发现改起来是多么的痛苦了.奔着这个目标,经过不断的Google,终于把这个问题解决了,感谢Google,感谢热心的上传者,呵呵!现在把解决方法也写下来.

   其实实现方式很简单,在css中加上Table{ jerry:expression(cellSpacing="1");},其它类似,这样就把问题解决了,我们的页面代码也清晰不少了.

 

 

在table 中控制单元格之间的间距要用到cellspacing、cellpadding,默认情况cellspacing、cellpadding均不为0,但经常的状况为了不让table单元格之间的间距影响到美观,我们经常会把cellspacing、cellpadding设置为0,因此经常看到“< table cellspacing=0 cellpadding=0>”这样的代码。这样做无形中增加了代码的体积,而且也极其不符合样式与内容分离的web标准,对于我本人来说也是极其厌恶这样的形式的,因此使用css控制cellspacing/cellpadding显的意义重大了!以下是控制方法:

table{border:0;margin:0;border-collapse:collapse;}
table td{padding:0;}

第一行控制cellspacing,关键是“border-collapse:collapse;”这一句;第二行控制cellpadding,很少人知道控制td吧?:)

0
0
分享到:
评论

相关推荐

    精美的css控制表格样式

    本主题聚焦于如何使用CSS来控制表格的样式,以实现“精美的”视觉效果。表格在网页中常用于展示数据,如报告、统计数据或产品目录,而通过恰当的CSS应用,我们可以让这些表格更加吸引人,提高用户体验。 1. **基础...

    css+div控制表格 标签代码

    标题“css+div控制表格 标签代码”表明我们将探讨如何利用CSS来改变和优化HTML表格的样式,使其符合网页设计的一般需求。 表格在网页中常用于展示结构化数据,其基本HTML标签包括`&lt;table&gt;`、`&lt;tr&gt;`(行)、`&lt;th&gt;`...

    利用CSS控制表格table的交替颜色

    本文将详细介绍如何通过CSS控制表格`&lt;table&gt;`的交替颜色,并提供具体的代码示例。 ### 一、基本原理 在HTML中,`&lt;table&gt;`元素用于创建表格,而`&lt;tr&gt;`代表表格的一行,`&lt;td&gt;`则表示表格中的一个单元格。CSS提供了...

    利用CSS控制表格外观

    ### 利用CSS控制表格外观的关键知识点 #### CSS与表格布局 在网页设计中,CSS(层叠样式表)提供了一种强大而灵活的方式来控制HTML表格的外观。本篇文章主要探讨了如何通过CSS来实现对表格外观的有效控制,包括...

    CSS3样式表- 列表与表格属性.pptx

    3. **caption-side**:控制表格标题(`&lt;caption&gt;`元素)的位置,可以是`top`(默认值,标题位于表格上方)、`bottom`(标题位于表格下方)或其他CSS布局值。 4. **border**:这是一个简写属性,用于一次性设置表格...

    CSS表格样式1

    在CSS(层叠样式表)中,表格样式是网页设计中的一个重要组成部分,它能帮助我们打造出美观且功能丰富的数据展示区域。这篇博文“CSS表格样式1”可能详细讲解了如何利用CSS来定制HTML表格的外观和布局。由于描述中...

    js css精美表格

    1. CSS(层叠样式表):CSS是用于控制网页元素样式的重要工具。在创建精美表格时,我们可以利用CSS来定义表格的边框、颜色、字体、对齐方式、背景图像等,以提升表格的视觉吸引力。例如,通过设置`border-collapse`...

    css表格样式打包下载

    CSS3的`transition`和`animation`属性可以为表格添加动态效果,如单元格高亮、滑动等,提升用户体验。 10. **表格排序和过滤**: 虽然这超出了CSS的范畴,但可以结合JavaScript库(如jQuery DataTables)实现表格...

    8款好看的css表格.rar

    1. **布局与结构**:CSS允许我们将表格的布局控制得更加灵活。可以设置单元格的宽度、高度、内边距和外边距,调整行和列的对齐方式,以及实现响应式设计,使表格在不同屏幕尺寸下都能良好显示。 2. **颜色与背景**...

    使用HTML开发商业网站-CSS控制表格边框课件.pptx

    首先,我们来看CSS控制表格边框的方法。表格的边框可以通过`border`属性进行设定。在示例中,`border:1px solid #F00;`这条CSS规则为整个表格设置了1像素宽度的红色实线边框。对于表格中的单元格(`td`和`th`),...

    21个新奇漂亮的AjaxCSS表格设计

    - **Collapsible tables with DOM and CSS**:通过DOM操作和CSS控制表格的展开和折叠,适合于复杂数据展示。 - **Table Sorter plug-in for jQuery**:支持多列排序、标签的rowspan和colspan属性,具备丰富的功能...

    html纯css实现表格样式

    CSS 则通过选择器和属性来控制表格的样式。以下是一些关键知识点: 1. **基础表格样式**:首先,可以使用 `border-collapse` 属性设置表格边框合并,例如 `border-collapse: collapse;`。这将使相邻单元格的边框...

    css table 表格标签

    在网页设计中,CSS(Cascading Style Sheets)是一种用于控制网页元素呈现样式的语言,而HTML中的`&lt;table&gt;`标签则是用来创建表格布局的重要元素。`&lt;table&gt;`标签允许我们构建复杂的表格结构,包括行(`&lt;tr&gt;`)、列(`...

    CSS在表格边框上的美学应用

    首先,我们需要了解CSS中与表格边框相关的属性。表格边框的控制主要包括边框宽度、边框颜色和边框样式。这些属性可以分别应用到表格的上、下、左、右边框,或者同时应用到所有边框。 1. **边框宽度**: - `border-...

    CSS属性之背景与表格

    1. **border-collapse**: 控制表格边框是否合并。`collapse`(默认,边框合并)和`separate`(边框不合并,显示边框间距)。 2. **border-spacing**: 当`border-collapse`为`separate`时,设置单元格之间的边距。 3....

    CSS3动画属性边框属性等

    **CSS背景属性**提供了丰富的控制元素背景的方法。`background` 可以一次性设置所有背景属性,包括颜色、图片、位置和重复方式。`background-attachment` 控制背景图片是否固定,`background-color` 设置背景色,`...

    CSS美化友好的表格

    此外,表格的宽度和高度可以通过`width`和`height`属性进行控制,也可以使用`max-width`和`max-height`限制其最大尺寸。如果希望表格自适应内容,可以使用`table-layout: fixed`配合`width`属性。 在处理表格内边距...

    利用CSS仿Excel表格的效果

    CSS是一种用于描述HTML或XML(包括如SVG、MathML等各种XML方言)文档样式的语言,它能让我们精确控制网页元素的布局和外观。下面我们将详细探讨如何利用CSS来创建一个具有Excel效果的表格。 首先,我们需要一个基本...

    用CSS样式定义的圆角表格

    这些标签通过CSS中的`display`属性被设置为块级元素,从而可以控制它们的尺寸和位置。 - 通过调整每个`&lt;b&gt;`标签的边距和高度,可以创建出具有不同圆角弧度的视觉效果。这种技巧在没有现代CSS圆角属性的情况下非常...

    Web前端开发基础:CSS控制表单.ppt

    --*-- 1 单元目标 2 教学内容 3 动手实践 4 课堂小结 单元目标 使用CSS控制页面背景、表格、表单 能力目标 学会使用CSS控制表单 知识目标 《CSS网页样式设计与制作》 参考资料 2 教学内容 1 单元目标 3 动手实践 4 ...

Global site tag (gtag.js) - Google Analytics