很久之前,给表格加边框用的方法是给表格加上背景色,然后把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. method 'redisConnectionFactory' threw exception; nested exception is java.lang.NoClassDefFoundError

    spring boot 整合redis是报了如下错误 org.springframework.beans.factory.UnsatisfiedDependencyException: Error c ...

  2. 有关mybatis的动态sql

    一般地,实现动态SQL都是在xml中使用等标签实现的. 我们在这里使用SQL构造器的方式, 即由abstract sql写出sql的过程, 当然感觉本质上还是一个StringBuilder, 来手动生 ...

  3. 总结一下自己脑海里的JavaScript吧(一)--DOM模型

    今天是2019年6月25日,闲来无事,写一篇文章来看看自己脑袋里装了多少JavaScript知识! 这儿就第一章: 说起JavaScript,它是什么?后端脚本语言?前端编程语言?还是在网站浏览器上运 ...

  4. git 指令记录

    由于之前一直用svn 用git也是用图形化的工具 还是要了解一下git指令 因为都是版本控制工具 有很多相似之处 所以理解起来也比较轻松 仓库: github上面的项目 工作目录下面的所有文件都不外乎 ...

  5. Linux下如何通过命令检查网卡是否插上网线

    How To:Linux下如何通过命令检查网卡是否插上网线   主要工具为ethtool来检查,主要关注的字段为"Link detected",注意如下的输出,其中em4实际物理上 ...

  6. Linux 安装Nginx+PHP+MySQL教程

    一.安装nginx 通过yum安装openssl: yum -y install openssl openssl-devel 通过yum安装pcre: yum -y install pcre-deve ...

  7. 【mysql】【转发】[Err]1267 - Illegal mix of collations(utf8_general_ci,IMPLICIT) and (utf8_unicode_ci,I

    [Err]1267 - Illegal mix of collations(utf8_general_ci,IMPLICIT) and (utf8_unicode_ci,IMPLICIT) for o ...

  8. Mac远程访问Ubuntu

    MacOS和Ubuntu连接到同一个网络使用ping命令可以通信即可.SSH使用SSH可以很方便的在MacOS上访问Ubuntu,不过只能用命令行操作,相当于连接了Ubuntu的终端. 1. Ubun ...

  9. 2018 Python开发者大调查:Python和JavaScript最配?

    在2018年秋季,Python软件基金会与JetBrains发起了年度Python开发者调查. 报告的目的是寻找Python领域的新趋势,帮助开发者深入了解2018年Python开发者的现状. 该报告 ...

  10. python输出mssql 查询结果示例

    # -*- coding: utf-8 -*-# python 3.6import pymssql conn=pymssql.connect(host='*****',user='******',pa ...