表格无边框,有内框,在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就行了,用法很简单


本文转自TBHacker博客园博客,原文链接:http://www.cnblogs.com/jiqing9006/p/3625458.html,如需转载请自行联系原作者

相关文章
|
Android开发
mac下配置adb环境变量
在终端中输入adb命令时,会提示 command not found ,这是是因为mac电脑下没有配置Android环境变量或者环境变量配置错误。
POST 请求出现异常!java.io.IOException: Server returned HTTP response code: 400 for URL
POST 请求出现异常!java.io.IOException: Server returned HTTP response code: 400 for URL
4594 0
|
Java Linux 计算机视觉
全网首发:Could NOT find JNI (missing: JAVA_AWT_INCLUDE_PATH) 解决办法
全网首发:Could NOT find JNI (missing: JAVA_AWT_INCLUDE_PATH) 解决办法
523 0
|
缓存 UED 开发者
全面加速Angular应用:从代码拆分到服务器端渲染的性能优化全攻略——深入探讨提升加载速度的有效策略
【8月更文挑战第31天】在现代Web开发中,提升应用加载速度对增强用户体验至关重要,尤其对于使用Angular框架的单页应用而言更是如此。本文通过解答五个常见问题,提供了一份全面的Angular性能优化攻略,涵盖减少初始加载时间、处理大型第三方库、优化变更检测、利用缓存以及服务器端渲染等技术。通过这些方法,开发者能够显著提升应用性能,确保流畅高效的用户体验。
221 0
|
数据采集 设计模式 自然语言处理
设计模式最佳套路2 —— 愉快地使用管道模式
管道模式(Pipeline Pattern) 是责任链模式(Chain of Responsibility Pattern)的常用变体之一。在管道模式中,管道扮演着流水线的角色,将数据传递到一个加工处理序列中,数据在每个步骤中被加工处理后,传递到下一个步骤进行加工处理,直到全部步骤处理完毕。 PS:纯的责任链模式在链上只会有一个处理器用于处理数据,而管道模式上多个处理器都会处理数据。
12883 0
设计模式最佳套路2 —— 愉快地使用管道模式
|
JavaScript IDE API
vue3中的单文件组件<script setup>和setup函数区别 详解(一)
vue3中的单文件组件<script setup>和setup函数区别 详解
690 0
|
Web App开发 移动开发 缓存
微信小程序面试题汇总
微信小程序面试题汇总
824 0
|
自然语言处理 算法 数据库
【JavaScript+自然语言处理+HTML+CSS】实现Web端的智能聊天问答客服实战(附源码 超详细必看)
【JavaScript+自然语言处理+HTML+CSS】实现Web端的智能聊天问答客服实战(附源码 超详细必看)
386 0
|
JavaScript 前端开发 测试技术
npm run dev启动报错:TypeError: Cannot read property 'upgrade' of undefined
npm run dev启动报错:TypeError: Cannot read property 'upgrade' of undefined
450 0
|
Ubuntu Apache Ruby

热门文章

最新文章