很久之前，给表格加边框用的方法是给表格加上背景色，然后把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. FMDB的使用方法（附Demo)

    http://www.jianshu.com/p/54e74ce87404 最近在项目中需要在多个页面对同样的数据进行相关操作,于是便用到了FMDB数据库操作,以下便是FMDB的一些简单的使用方法.附 ...

  2. Form组件的验证流程及扩展(钩子)

    Form组件的验证流程及扩展(钩子) 常用的form class TestForm(Form): t1 = fields.CharField( widget=widgets.Textarea # 输入 ...

  3. ES6中const的用法

    const声明一个只读的常量.一旦声明,常量的值就不能改变.且const一旦声明变量,就必须立即初始化,不能留到以后赋值. const的作用域与let命令相同:只在声明所在的块级作用域内有效. con ...

  4. JDK安装及环境变量配置详解

    一.下载(Jdk 1.8 ) 1.下载地址:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151 ...

  5. 2_分布式计算框架MapReduce

    一.mr介绍 1.MapReduce设计理念是移动计算而不是移动数据,就是把分析计算的程序,分别拷贝一份到不同的机器上,而不是移动数据. 2.计算框架有很多,不是谁替换谁的问题,是谁更适合的问题.mr ...

  6. DNS 工作原理是什么，域名劫持、域名欺骗、域名污染又是什么

    DNS 工作原理是什么,域名劫持.域名欺骗.域名污染又是什么 2014年11月27日 10:05:40 阅读数:6726 标签: dns网络互联网顶级域名递归 更多 个人分类: 网络学习   一.DN ...

  7. Windows7设置局域网文件共享

    首先要实现共享必须设置共享的机器与访问共享的机器在同一个工作组中. 右键桌面上的计算机图标=>属性 如果不一样的话,就需要点击[更改设置] 右键要共享的文件或者文件夹,点击[共享]打开共享标签: ...

  8. spring boot yaml 自定义配置 映射到 java POJO

    只需要一个注解就ok: @ConfigurationProperties("user.other") “user.other” 这个值匹配的是user下的other对象 yaml ...

  9. MySQL中文转换成拼音的函数

    CREATE DEFINER=`root`@`localhost` FUNCTION `fristPinyin`(`P_NAME` VARCHAR(255) CHARSET utf8) RETURNS ...

  10. 使用nohup+& 踩到的坑

    首先分清楚nohup与&: &是指在后台运行一般在执行命令后,都会显式的在前台执行,当Ctrl+C后进程回宕掉,但是 在命令后加&,即使Ctrl+C,程序还在进行,但是,当关闭 ...