表格边框css
table标签默认是没有边框的,但是如果我们自己加上边框boder:1px solid black;只有整个表格最外面有边框,那么如何给表格添加样式使得整个表格的tr、td都具有边框呢:
<style>
table, th , td {
border: 1px solid grey;
border-collapse: collapse;
padding: 5px;
}
table tr:nth-child(odd) {
background-color: #f1f1f1;
}
table tr:nth-child(even) {
background-color: #ffffff;
}
</style>
上面代码中最后还加上了CSS3 :nth-child() 选择器对奇、偶行采用不同的背景色,同时也可以采用公式table tr:(2n+1)使用。
表格边框css的更多相关文章
- 设置表格边框css样式
table{ width:70%; text-align:center; border-left:#C8B9AE solid 1px; border-top:#C8B9AE solid 1px; bo ...
- [转]CSS如何设置html table表格边框样式
原文地址:http://www.divcss5.com/wenji/w503.shtml 对table设置css样式边框,分为几种情况: 1.只对table设置边框 2.对td设置边框 3.对tabl ...
- css中的border-collapse属性如何设置表格边框线?(代码示例)
css中的border-collapse属性如何设置表格边框线?本篇文章就给大家介绍css中的border-collapse属性是什么? border-collapse属性设置表格边框线的方法.有一定 ...
- CSS之表格边框合并、兄弟标签外边距合并、父子标签的外边距合并
本文内容: 表格边框合并 兄弟标签外边距合并 父子标签的外边距合并 首发日期:2018-05-01 表格边框合并: 发生情况: 当设置了cellpadding="0" cellsp ...
- CSS学习笔记(3)--表格边框
http://www.alixixi.com/web/a/2009082657736.shtml 对于很多初学HTML的人来说,表格<table>是最常用的标签了,但对于表格边框的控制,很 ...
- 关于vue 中elementui 的表格边框隐藏
最近写到一个项目需要实现边框隐藏,网上查找了好多笔记,回答都好含糊不清.为此,记录一下自己的实现方法: 需求: 要将如下表格边框去除 效果图: ...
- JavaScript变换表格边框颜色
效果查看:http://hovertree.com/texiao/js/2.htm 代码如下,保存到HTML文件也可以查看效果: <html> <head> <meta ...
- HTML表格边框的设置小技巧
对于很多初学HTML的人来说,表格<table>是最常用的标签了,但对于表格边框的控制,很多初学者却不甚其解. 对于很多初学HTML的人来说,表格<table>是最常用的标签了 ...
- (转)HTML表格边框的设置小技巧
对于很多初学HTML的人来说,表格<table>是最常用的标签了,但对于表格边框的控制,很多初学者却不甚其解. 对于很多初学HTML的人来说,表格<table>是最常用的标签了 ...
随机推荐
- IOS - Passbook
1. 什么是Passbook Passbook是苹果公司于北京时间2012年6月12日上午,在全球开发者大会(WWDC)上宣布了iOS 6系统将提供操作一个全新的应用——Passbook 这是一款可以 ...
- 使用cocoapods导入第三方类库后 头文件没有代码提示?
选择Target -> Build Settings 菜单,找到\”User Header Search Paths\”设置项 新增一个值"${SRCROOT}",并且选择\ ...
- Office文件的Open Xml 格式
获取Office文件的Open Xml格式文件的步骤如下: 1.修改想要得到OpenXml格式文件的文件后缀名为.rar. 2.解压即可得到. 此时可以对xml文件进行操作,要想再次把这已经解压后的文 ...
- arcgis
投影的时候两个选择: projected:平面的,以米为单位 另一个:球迷的,以经纬度为单位
- TortoiseSVN中Branching和Merging实践
转自:http://blog.csdn.net/eggcalm/article/details/6606520 使用svn几年了,一直对分支和合并敬而远之,一来是因为分支的管理不该我操心,二来即使涉及 ...
- vector< vector<int> >类似于二维数组
vector< vector<int> > intVV; vector<int> intV; int i,j; ;i<;++i){ intV.clear(); ...
- 有关Oracle数据库
创建数据库(DCA):http://jingyan.baidu.com/article/cbcede07cf42ef02f40b4dc2.html 创建表(连接数据库,sql创建数据表):http:/ ...
- EF – 6.一对一关联
5.6.6 <一对一关联概述> 5.6.7 <一对一关联CRUD演示> 在两讲视频中,首先介绍了数据库中一对一关联表的设计规范,接着通过实例介绍了如何合适Entity Fr ...
- MangoDB的C#Driver驱动简单例子
以下是本人学习C#Driver驱动简单的学习例子.GridFS的增删查操作 和 表的增删查改操作. public class MongoServerHelper { public static str ...
- 跳出IFrame几种方式
1. <script type="text/javascript"> if (top.location !== self.location) { top.locatio ...