zoukankan      html  css  js  c++  java
  • 制作1px边框表格的几种方法[转]

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

    一、用嵌套表格

    用两个表格嵌套,外层的表格的长与宽比里层的多出2px,并设置对齐属性为水平居中、垂直居中,然后把外层表格的背景设为你需要的边框颜色,里层表格背景设为与网页背景相同,这样就实现我们的愿望了,实例如下:
    -----------------------------------------------------------------
    <table cellspacing="0" 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="1" width="32" height="32" style="border: 1px solid #000000; ">
    <tr>
    <td> </td>
    </tr>
    </table>
    -----------------------------------------------------------------
    有一点一定要注意:这时候不要再设置表格边框(border)、亮边框(bordercolorlight)和暗边框(bordercolordark)属性,否则不会出现预想的结果。
     
     

  • 相关阅读:
    Python Revisited Day 13 (正则表达式)
    Python Revisited Day 06 (面向对象程序设计)
    Python Revisited (变量)
    Python Revisited Day 05(模块)
    Python Revisited Day 04 (控制结构与函数)
    Python Revisited Day 03 (组合数据类型)
    Numpy
    Python Revisited Day 01
    Python3使用openpyxl读写Excel文件
    Python3操作YAML文件
  • 原文地址:https://www.cnblogs.com/cnaspnet/p/1255717.html
Copyright © 2011-2022 走看看