zoukankan      html  css  js  c++  java
  • html细线表格的实现

    在网页制作中,我们常常会使用到表格,表格使得需要表达的信息更清楚,明了。

    <table border="1" cellspacing="0" bordercolor="#000000" width = "80%">
        <tr>
            <td>1.1</td>
            <td>1.2</td>
        </tr>
        <tr>
            <td>2.1</td>
            <td>2.2</td>
        </tr>
    <table>

    这段代码定义了border = 1pix的表格,但实际上表格的实际边框宽度为2pix, 这是因为表格边框由:表格外边框和单元格边框两部分构成。
    那么如何定义一个细线表格(实际边宽为1pix) 呢?
    1. 使用 cellspacing和背景色技术:

    <table border="0" cellspacing="1" bgcolor="#000000" width = "80%">
        <tr bgcolor="#ffffff">
            <td>1.1</td>
            <td>1.2</td>
        </tr>
        <tr bgcolor="#ffffff">
            <td>2.1</td>
            <td>2.2</td>
        </tr>
    <table>

    2.使用border-collapse属性:

    <table border="1" cellspacing="0" bordercolor="#000000" width = "80%" style="border-collapse:collapse;">
        <tr>
            <td>1.1</td>
            <td>1.2</td>
        </tr>
        <tr>
            <td>2.1</td>
            <td>2.2</td>
        </tr>
    <table>

    提醒: 对于通过方法1制作出来的细线表格,在打印时可能会出现表格边框打印不出来的问题。 而方法2就没有这个问题,推荐使用。

  • 相关阅读:
    239. [LeetCode ]Sliding Window Maximum
    152.[LeetCode] Maximum Product Subarray
    53. [LeetCode] Maximum Subarray
    90 [LeetCode] Subsets2
    78[LeetCode] Subsets
    练习7.52
    练习7.47、7.48、7.49、7.51
    关于类类型的隐式类型转换
    练习7.44、7.45、7.46
    练习7.36、7.37、7.39、7.40
  • 原文地址:https://www.cnblogs.com/xjsllll/p/2998160.html
Copyright © 2011-2022 走看看