很久之前，给表格加边框用的方法是给表格加上背景色，然后把cellspacing="1"，再给td设置成另一种颜色，这样间接的加边框颜色。

一直没去细研究，今天发现了一种很简单的加边框的方法，关键代码如下：

.a{border-collapse:collapse; border:1px solid #339999;}
.a tr td{border:1px solid #339999;}

我和同事想要实现的方法是两个表格落在一起，下边表格的边框去掉，也就是表格没有上边框，css样式如下：

.a{border-collapse:collapse; border:1px solid #339999; border-top:0px solid #339999}
.a tr td{border:1px solid #339999;border-top:0px solid #339999}

html代码如下：

<style type="text/css">
<!--
.a{border-collapse:collapse; border:1px solid #339999; border-top:0px solid #339999}
.a tr td{border:1px solid #339999;border-top:0px solid #339999}
-->
</style></head>

<body>
<table height="60" cellpadding="5" width="60%" class="a">
  <tr>
    <td>0</td>
    <td>0</td>
    <td>0</td>
  </tr>
  <tr>
    <td>0</td>
    <td>0</td>
    <td>0</td>
  </tr>
</table>

同事最初找的代码如下，上面的代码就是这个代码的优化结果：

<table style="border-collapse:collapse" border="1" bordercolor="#339999" height="60" cellpadding="5" width="60%">
<tr><td>0</td><td>0</td><td>0</td></tr>
<tr><td>0</td><td>0</td><td>0</td></tr>
<tr><td>0</td><td>0</td><td>0</td></tr>
<tr><td>0</td><td>0</td><td>0</td></tr>
<tr><td>0</td><td>0</td><td>0</td></tr>
</table>

本文转自：　http://lnzengjie.blog.163.com/blog/static/236201622009880948440/

用CSS给表格加边框的更多相关文章

  1. CSS操作表格的边框和表格的属性示例代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. 用CSS为表格添加边框

    格式: <style type="text/css"> table tr td,th {border:1px solid #000;} </style>

  3. Html-浅谈如何正确给table加边框

    一般来说,给表格加边框都会出现不同的问题,以下是给表格加边框后展现比较好的方式 <style> table,table tr th, table tr td { border:1px so ...

  4. 浅谈如何正确给table加边框

    一般来说,给表格加边框都会出现不同的问题,以下是给表格加边框后展现比较好的方式 <style> table,table tr th, table tr td { border:1px so ...

  5. 2017-11-28 Html-浅谈如何正确给table加边框

    一般来说,给表格加边框都会出现不同的问题,以下是给表格加边框后展现比较好的方式 <style> table,table tr th, table tr td { border:1px so ...

  6. Html-如何正确给table加边框

    一般来说,给表格加边框都会出现不同的问题,以下是给表格加边框后展现比较好的方式 <style> table,table tr th, table tr td { border:1px so ...

  7. Bootstrap3基础 table-bordered/hover 表格加外边框和鼠标悬停对应行的背景色加深

      内容 参数   OS   Windows 10 x64   browser   Firefox 65.0.2   framework     Bootstrap 3.3.7   editor    ...

  8. CSS鼠标悬停图片加边框效果,不位移的方法

    <!DOCTYPE HTML> <html lang="en-US"> <head> <title>css实现鼠标悬停时图片加边框效 ...

  9. word中几个好用的宏代码（立方米上标、关闭样式自动更新、删除无效样式、表格加粗边框、宋体引号）

    Sub 替换立方米() With Selection.Find .Text = "m3" .Replacement.Text = "mm3" .Forward ...

随机推荐

  1. Python 继承、派生、组合、接口、抽象类

    继承是一种是的关系,和组合对比,组合是一种有的关系,这两者都是解决代用重用问题的 继承 注意:继承不是遗传,在显示角度中,是通过对象抽象成类,再把这些类抽象成一个,就是父类.是自下而上的过程,在程序中 ...

  2. Python学习记录4（语句）

    赋值语句 序列解包 条件语句 语句块 布尔变量 条件执行和if语句 条件运算符 循环 while语句 for循环 迭代工具 跳出循环 break continue while truebreak语句 ...

  3. VNC远程登录端使用经验之一

    1.vnc/xmanager都是经常用的远程登录软件.vnc有个缺点就是他的进程不会自动退出比如如果开了PID1再去开PID2...PIDn.那么前面的PIDn-1个进程就会一直运行如果不手动kill ...

  4. 如何封装RESTful Web Service

    所谓Web Service是一个平台独立的,低耦合的,自包含的.可编程的Web应用程序,有了Web Service异构系统之间就可以通过XML或JSON来交换数据,这样就可以用于开发分布式的互操作的应 ...

  5. matplotlib学习记录 二

    # 绘制10点到12点的每一分钟气温变化折线图 import random from matplotlib import pyplot as plt # 让matplotlib能够显示中文 plt.r ...

  6. 03 Django视图

    功能 接受Web请求HttpRequest,进行逻辑处理,与 M 和 T 进行交互,返回 Web 响应 HttpResponse 给请求者 示例项目的创建 创建项目 test3 django-admi ...

  7. 中国电信物联网平台入门学习笔记2： DOME程序分析

    "墨子号NB-IOT开发板"提供的dome: 程序只要分为延时,定时器,串口通讯…… 工程文件在:…\STM32L1xx_StdPeriph_Lib_V1.3.1\Project\ ...

  8. 在linux下安装并运行scrapyd

    系统:centos7.4 安装scrapyd:pip isntall scrapyd 因为我腾讯云上是python2与python3并存的 所以我执行的命令是:pip3 isntall scrapyd ...

  9. leetcode-21-knapsack

    322. Coin Change Write a function to compute the fewest number of coins that you need to make up tha ...

  10. (转)iOS平台UDID方案比较

    苹果在iOS6中禁用了[UIDevice uniqueIdentifier],在iOS7中又把mac地址的获取给堵上了.没办法,毕竟人家是老大,说不让你用,你也没办法.   在这边总结一下现有的一部分 ...