用CSS给表格加边框
很久之前,给表格加边框用的方法是给表格加上背景色,然后把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给表格加边框的更多相关文章
- CSS操作表格的边框和表格的属性示例代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 用CSS为表格添加边框
格式: <style type="text/css"> table tr td,th {border:1px solid #000;} </style>
- Html-浅谈如何正确给table加边框
一般来说,给表格加边框都会出现不同的问题,以下是给表格加边框后展现比较好的方式 <style> table,table tr th, table tr td { border:1px so ...
- 浅谈如何正确给table加边框
一般来说,给表格加边框都会出现不同的问题,以下是给表格加边框后展现比较好的方式 <style> table,table tr th, table tr td { border:1px so ...
- 2017-11-28 Html-浅谈如何正确给table加边框
一般来说,给表格加边框都会出现不同的问题,以下是给表格加边框后展现比较好的方式 <style> table,table tr th, table tr td { border:1px so ...
- Html-如何正确给table加边框
一般来说,给表格加边框都会出现不同的问题,以下是给表格加边框后展现比较好的方式 <style> table,table tr th, table tr td { border:1px so ...
- Bootstrap3基础 table-bordered/hover 表格加外边框和鼠标悬停对应行的背景色加深
内容 参数 OS Windows 10 x64 browser Firefox 65.0.2 framework Bootstrap 3.3.7 editor ...
- CSS鼠标悬停图片加边框效果,不位移的方法
<!DOCTYPE HTML> <html lang="en-US"> <head> <title>css实现鼠标悬停时图片加边框效 ...
- word中几个好用的宏代码(立方米上标、关闭样式自动更新、删除无效样式、表格加粗边框、宋体引号)
Sub 替换立方米() With Selection.Find .Text = "m3" .Replacement.Text = "mm3" .Forward ...
随机推荐
- method 'redisConnectionFactory' threw exception; nested exception is java.lang.NoClassDefFoundError
spring boot 整合redis是报了如下错误 org.springframework.beans.factory.UnsatisfiedDependencyException: Error c ...
- 有关mybatis的动态sql
一般地,实现动态SQL都是在xml中使用等标签实现的. 我们在这里使用SQL构造器的方式, 即由abstract sql写出sql的过程, 当然感觉本质上还是一个StringBuilder, 来手动生 ...
- 总结一下自己脑海里的JavaScript吧(一)--DOM模型
今天是2019年6月25日,闲来无事,写一篇文章来看看自己脑袋里装了多少JavaScript知识! 这儿就第一章: 说起JavaScript,它是什么?后端脚本语言?前端编程语言?还是在网站浏览器上运 ...
- git 指令记录
由于之前一直用svn 用git也是用图形化的工具 还是要了解一下git指令 因为都是版本控制工具 有很多相似之处 所以理解起来也比较轻松 仓库: github上面的项目 工作目录下面的所有文件都不外乎 ...
- Linux下如何通过命令检查网卡是否插上网线
How To:Linux下如何通过命令检查网卡是否插上网线 主要工具为ethtool来检查,主要关注的字段为"Link detected",注意如下的输出,其中em4实际物理上 ...
- Linux 安装Nginx+PHP+MySQL教程
一.安装nginx 通过yum安装openssl: yum -y install openssl openssl-devel 通过yum安装pcre: yum -y install pcre-deve ...
- 【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 ...
- Mac远程访问Ubuntu
MacOS和Ubuntu连接到同一个网络使用ping命令可以通信即可.SSH使用SSH可以很方便的在MacOS上访问Ubuntu,不过只能用命令行操作,相当于连接了Ubuntu的终端. 1. Ubun ...
- 2018 Python开发者大调查:Python和JavaScript最配?
在2018年秋季,Python软件基金会与JetBrains发起了年度Python开发者调查. 报告的目的是寻找Python领域的新趋势,帮助开发者深入了解2018年Python开发者的现状. 该报告 ...
- python输出mssql 查询结果示例
# -*- coding: utf-8 -*-# python 3.6import pymssql conn=pymssql.connect(host='*****',user='******',pa ...