zoukankan      html  css  js  c++  java
  • 表格无边框,有内框,在table嵌套时,防止出现重复边线

    <html>
    <head>
    <title>test 表格无边框,有内框! ^^ CSDN 学习积累</title>
    <style type="text/css">
    #table {border:none;width:100%;}
    #table td {border-bottom:1px solid #000;border-right:1px solid #000;}
    #table td.two {border-right:none;}
    #table td.thr {border-bottom:none;}
    </style>
    </head>
    <body>
    <table id="table" cellpadding="0" cellspacing="0">
      <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td class="two">&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td class="two">&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td class="two">&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td class="two">&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td class="two">&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td class="two">&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td class="two">&nbsp;</td>
      </tr>
      <tr>
        <td class="thr">&nbsp;</td>
        <td class="thr">&nbsp;</td>
        <td class="thr">&nbsp;</td>
        <td class="thr">&nbsp;</td>
        <td class="thr">&nbsp;</td>
        <td class="thr">&nbsp;</td>
        <td class="thr">&nbsp;</td>
        <td class="two thr">&nbsp;</td>
      </tr>
    </table>
    </body>
    </html>

    只要在每一行的最后一列加一个two,再在最后一行的所有列加上thr就行了,用法很简单

  • 相关阅读:
    关于博客园各项工具的使用
    Java常用的7大排序算法汇总
    Java 基本数据类型(新手必看资料)
    学习Java,还需要学好哪些知识
    JavaSE基础知识总结
    python2.7.11安装pygame包
    phpstorm打开项目目录时,出现一直在扫描文件
    laravel 通过npm搭建前端资源的注意事项
    基于laravel5.2进行rabbitmq队列服务发送接收信息
    在centos7中安装composer
  • 原文地址:https://www.cnblogs.com/jiqing9006/p/3625458.html
Copyright © 2011-2022 走看看