很久之前，给表格加边框用的方法是给表格加上背景色，然后把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. 新萝卜家园GHOST WIN7系统32,64位官方版下载

    来自系统妈:http://www.xitongma.com 新萝卜家园GHOST win7系统64位官方经典版 V2016年3月 系统概述 新萝卜家园ghost win7系统64位官方经典版加快“网上 ...

  2. 2018.2.27 JavaScript数组方法应用

    JavaScript数组方法应用 1.找出元素item在给定数组arr中的位置 function indexOf(arr,item){ return arr.indexOf(item); } func ...

  3. Virt-install用法：

       #一般选项:指定虚拟机的名称.内存大小.VCPU个数及特性等 -n  NAME,  --name=NAME:虚拟机名称,需全局惟一: -r  MEMORY,  --ram=MEMORY:虚拟机内 ...

  4. 【细节题 离线 树状数组】luoguP4919 Marisa采蘑菇

    歧义差评:但是和题意理解一样了之后细节依然处理了很久,说明还是水平不够…… 题目描述 Marisa来到了森林之中,看到了一排nn个五颜六色的蘑菇,编号从1-n1−n,这些蘑菇的颜色分别为col[1], ...

  5. Centos7系统下安装Docker

    1.确定你的Linux系统是Centos7 命令:cat /etc/redhat-release 2.yum安装gcc相关 1.配置好Centos7能上外网. 2.yum -y install gcc ...

  6. idea 启动不了

    idea 更新了新版本.  破解步骤安排完了之后 ,  发现怎么也启动不了.  没有任何提示. 于是为了查看错误信息去idea的安装目录bin下用idea.bat脚本启动发现了如下错误: 在idea6 ...

  7. Python基础——判断和循环

    判断 缩进代替大括号. 冒号(:)后换号缩进. if test=100 if test>50: print('OK') print('test') if-elif-else test=50 if ...

  8. 对java多线程的一些浅浅的理解

    作为一名JAVA初学者,前几天刚刚接触多线程这个东西,有了些微微的理解想写下来(不对的地方请多多包涵并指教哈). 多线程怎么写代码就不说了,一搜一大堆.说说多线程我认为最难搞的地方,就是来回释放锁以及 ...

  9. Linux的档案权限与目录配置练习题

    1.请说明/bin与/usr/bin目录所防止的执行文件有何不同之处:/bin主要放置在开机时,以及进入单人维护模式后还能够被使用的指令,至于/usr/bin则是大部分软件提供的指令放置处 2.请说明 ...

  10. An entity cannot be annotated with both @Entity and @MappedSuperclass: com.example1.demo1.Entity.User错误

    项目问SpringDataJpa项目,在运行的过程中出现的以下错误: Caused by: org.hibernate.AnnotationException: An entity cannot be ...