制作1px边框表格的几种方法

  有过网页制作经验的朋友一定知道:一般来讲,把表格的边框定义为1px时,即border=1,而实际上是2px。而我们在很多时候需要那种真正的边框为1px的表格,下面就介绍几种方法。

  一、用嵌套表格
  用两个表格嵌套,外层的表格的长与宽比里层的多出2px,并设置对齐属性为水平居中、垂直居中,然后把外层表格的背景设为你需要的边框颜色,里层表格背景设为与网页背景相同,这样就实现我们的愿望了,实例如下:
  <table cellspacing="1" cellpadding="0" bgcolor="#000000" width="32" height="32" border="0">
  <tr>
  <td align="center">
  <table cellspacing="0" cellpadding="0" bgcolor="#ffffff" width="30" height="30" border="0">
  <tr>
  <td> </td>
  </tr>
  </td>
  </tr>
  </table>

  二、设置亮、暗边框颜色
  表格有亮边框(bordercolorlight)和暗边框(bordercolordark)两个属性,把表格边框(border)设为1px,亮边框(bordercolorlight)设为背景色,暗边框(bordercolordark)设为你需要的实际边框颜色就可以了,实列如下:
  <table border="1" cellpadding="0" cellspacing="0" width="32" height="32" bordercolorlight="#000000" bordercolordark="#FFFFFF">
  <tr>
  <td> </td>
  </tr>
  </table>

  三、用CSS定义(一)
代码为:style="border-collapse: collapse"

  实例如下:
  <table border="1" cellspacing="0" width="32" height="32" style="border-collapse: collapse" bordercolor="#000000" cellpadding="0">
  <tr>
  <td> </td>
  </tr>
  </table>
  如果你用过Frontpage xp,你会发现,在Frontpage xp中定义的表格默认的设置就是用CSS定义过了的。

  四、用CSS定义(二)
  代码为:style="border: 1px solid #000000;"
  实例如下:
  <table cellspacing="0" cellpadding="0" border="0" width="32" height="32" style="border: 1px solid #000000; ">
  <tr>
  <td> </td>
  </tr>
  </table>
  有一点一定要注意:这时候不要再设置表格边框(border)、亮边框(bordercolorlight)和暗边框(bordercolordark)属性,否则不会出现预想的结果。

时间: 2024-12-25 21:51:57

制作1px边框表格的几种方法的相关文章

Dreamweaver制作1px边框表格的几种方法

有过网页制作经验的朋友一定知道:一般来讲,把表格的边框定义为1px时,即border=1,而实际上是2px.而我们在很多时候需要那种真正的边框为1px的表格,下面就介绍几种方法. 一.用嵌套表格 用两个表格嵌套,外层的表格的长与宽比里层的多出2px,并设置对齐属性为水平居中.垂直居中,然后把外层表格的背景设为你需要的边框颜色,里层表格背景设为与网页背景相同,这样就实现我们的愿望了,实例如下: <table cellspacing="0" cellpadding="0&q

美化你的网页 制作精美圆角表格的两种方法

网页|圆角 做网页时候为了美化网页,常常把表格边框的拐角处做成圆角,这样可以避免直接使用表格直角的生硬,使得网页整体更加美观.下面就给大家介绍两种制作圆角表格的常用的办法.方法一:用图片制作圆角表格这是最常用也是最通用的方法,它能很好地适应各种浏览器和不同分辨率,大部分网页都使用这种方法. ①先用Photoshop等作图软件绘制一个圆角矩形,再用"矩形选框工具"选取左上交的圆角部分(如图1),复制它. ②不要取消选取,直接新建一副图像,Photoshop会根据选取部分的高度.宽度自动设

Excel中制作下拉菜单的4种方法

Excel中制作下拉菜单的4种方法   其实还有另外3种: 1.创建列表 在一列中按alt+向下箭头,即可生成一个下拉菜单(创建列表).此方法非常简单. 2.开发工具 - 插入 - 组合框(窗体控件) 如果你的excel没有[开发工具]选项,可以从 文件 - 选项 - 自定义功能区,选中"开发工具".(excel2007为office按钮 - excel选项 - 常规 - 显示"开发工具") 3.开发工具 - 组合框(ActiveX控件) 注: 在"设计模

Excel中制作一个项目文件目录的两种方法

  Excel中制作一个项目文件目录的两种方法.如下图所示,就是一个项目文件夹内的所有文件: 接下来,先提取文件名称. 如果文件比较少,可以直接输入到Excel文档中,但是如果文件比较多,就要想想办法了. 方法一 在工程文件夹内,新建一个记事本文档,输入下面的内容后保存: DIR *.* /B >目录.TXT 将记事本文档的后缀名.txt 修改为.bat 然后双击这个文件,就会得到一个名为"目录"的记事本文件,里面会包含当前文件夹内的所有文件名. 这样就可以将目录中的文档名复制到

Fireworks制作渐隐线效果的2种方法

好多人问关于渐隐线的制作方法,其实渐隐线的做法非常简单,一般来说有两种方法: 一.矩形的填充... 矩形做法一,适合大部分的情况: 1.用矩形工具画出一个像素高的矩形. 图1 2.在面板处选择线性填充,具体的调节如下: 图2 面板讲解:大家可以看到最上面有两排箭头.其中 这个标志的一排是透明度 这个标志的一排是颜色. 通过在上下点击面板添加新箭头.... 通过这样的渐变可以得到如下的效果: 图3 矩形做法二: 如果是单色背景,可以考虑直接选择颜色箭头中的两端为背景色,中间为你需要的线条颜色,模拟

网页设计中打造细边表格的三种方法

    首先声明以下几个方法并不是全部,只是今天我在制作的时候又一次用到了其中的一种方法,所以在此也把自己常用的方法跟大家共享一下.希望对大家有所帮助,当然更欢迎大家提出自己的想法,大家彼此交流一下,共同进步!     一.利用CSS样式 style="border:1px solid #ff0000" <table width="200" border="0" cellpadding="0" cellspacing=&

如何在Dreamweaver中制作细边框表格

  具体制作步骤如下: 通过利用背景颜色与间距制作细边的表格教程的介绍,大家在Dreamweaver中插入一个表格,若设置其"边框(Border)"为1,预览时其边框线较粗. 以制作一个4行3列.边框线为红色细线的表格为例: 1.在Dreamweaver的设计视图中插入一个4行3列的表格. 2.在"属性"面板中设置此表格的属性如下:边距(CellPad)根据需要自行设置值(例如10);间距(CellSpace)为1;边框(Border) 为0;背景颜色(Bg Col

Photoshop制作标准椭圆矩形的三种方法

椭圆矩形介于圆和圆角矩形中间的形状,主题图标绘制最流行的形状之一;有一些新人和身边朋友问我怎么制作这形状,所以,分享一下我的绘制方法. 最终效果 准备工作: 打开Photoshop,新建600 * 600的画布,其它参数默认,点确定. 方法1: 鼠标移至左侧工具栏矩形工具上,点击三角箭头切换成多边形工具.鼠标移至选项栏设置边:4,点击设置图标(齿轮),按下展开,勾选平滑拐角. 按住Shift,按住鼠标左键在画布中央绘制就可以了. 放大之后发现它的边缘是虚的像素,为了更加精确的显示,要让边缘对齐像

用Excel制作漂亮的工资条的3种方法

如何使用Excel进行工资条的制作,也许有些网友使用已经很长时间了,但如何更快更好的做出漂亮的工资条,看看作者的方法吧. "小问题难倒老财务",也许你已经在财务口上工作多年,也许你天天都要面对Excel那张老脸,也许你已经习惯了用工资明细表做员工工资统计并 向上级汇报,把表中的条目一条条复制粘贴后打印发给每个员工.可你是否想过,找一个更简单更有效率的方法?看起来这似乎有些困难:在工资明细表中,工资的 项目(即表头)一般只出现在表格开头的某一行,而在工资条中,为了便于阅读则要求每个人的工