table边框设置
一、表格的常用属性
基本属性有:width(宽度)、height(高度)、border(边框值)、cellspacing(表格的内宽,即表格与tr之间的间隔)、 cellpadding(表格内元素的间隔,即tr与tr之间的间隔)、bordercolorlight(表格的亮边框颜色)、 bordercolordark(表格的暗边框颜色)、bgcolor(表格的背景色)、background(表格的背景图片)、 bordercolor(表格边框的颜色),
二、table边框单线的实现方法
现在给出效果图:
1、实现方法一:
<table border="0" cellspacing="1" style="background-color:#a0c6e5">
实现原理:利用table的单元格之间的间距(cellspacing)和table的背景色来实现
2、实现方法二:
<table border="1" bordercolor="#a0c6e5" style="border-collapse:collapse;">
<tr>
<td style="border: solid 1px #a0c6e5; height: 20px;"> </td> <td style="border: solid 1px #a0c6e5; height: 20px;"> </td> <td style="border: solid 1px #a0c6e5; height: 20px;"> </td>
</tr>
</table>
实现原理:利用table的border,bordercolor="#a0c6e5"实现table的边框,但是此时的边框太粗,
这时就可以用到style属性里的border-collapse:collapse样式
二、表格内部分隔线的属性
起作用的是rules这个参数,它有三个值(cols,rows,none),当rules=cols时,表格会隐藏横向的分隔线,也就是我们只能看到表 格的列;当rules=rows时,就隐藏了纵向的分隔线,也就是我们只能看到表格的行;而当rules=none时,纵向分隔线和横向分隔线将全部隐 藏,我们就只能看到一个表格的外框了。看一下下面的对比效果你就会明白的
三、表格外部分隔线的属性
表格外边框的显示与隐藏,是可以用frame参数来控制的。注意:只对表格的外边框起作用,对内部边、线不起作用
只显示上边框 <table frame=above>
只显示下边框 <table frame=below>
只显示左、右边框 <table frame=vsides>
只显示上、下边框 <table frame=hsides>
只显示左边框 <table frame=lhs>
只显示右边框 <table frame=rhs>
不显示任何边框 <table frame=void>
table边框设置的更多相关文章
- table边框不显示
今日在做报表的时候发现,最后一行隐藏后整个报表的下边框会不显示,猜测是td的边框隐藏后但table并未设置边框,导致下边框没有出现.因此设置了table边框后问题解决.table和td的边框关系如下实 ...
- 解决table边框在打印中不显示的问题
先了解一下,table边框如何设置 一.只对表格table标签设置边框 只对table标签设置border(边框)样式,将让此表格最外层table一个边框,而表格内部不产生边框样式.CSS代码: .t ...
- HTML小技巧将table边框改为细线
HTML制作新手在用TABLE表格时,会碰到如何改变边线粗线,因为默认的TABLE边线设置即使是1px 是很粗的.因此会使用其他一些方法来制作出细线边框,这里介绍一种利用CSS来实现细线的方法,很有效 ...
- table 边框问题
对table设置css样式边框,分为几种情况:1.只对table设置边框2.对td设置边框3.对table和td技巧性设置表格边框4.对table和td设置背景,实现完美表格边框 以下DIVCSS5对 ...
- 借助JavaScript中的Dom属性改变Html中Table边框的颜色
借助JavaScript中的Dom属性改变Html中Table边框的颜色 -------------------- <html> <head> <title>我是页 ...
- 借助JavaScript中的时间函数改变Html中Table边框的颜色
借助JavaScript中的时间函数改变Html中Table边框的颜色 <html> <head> <meta http-equiv="Content-Type ...
- Qt QGroupBox StyleSheet 边框设置
/**************************************************************************** * Qt QGroupBox StyleSh ...
- Table样式设置
<table class="listTable"> <tr><th width="40px">序号</th>&l ...
- 表格Table宽度设置无效的解决方法
表格Table宽度设置无效的解决方法 bootstrap中使用table时发现不管用width赋值方式都无法改变table>td的宽度 解决方法: 设置table:table-layout:fi ...
随机推荐
- php基础八(cookie)
cookie 常用于识别用户.cookie 是服务器留在用户计算机中的小文件.每当相同的计算机通过浏览器请求页面时,它同时会发送 cookie.通过 PHP,您能够创建并取回 cookie 的值. 如 ...
- map 理解
键值对 map会将同名的值覆盖掉 public static void main(String[] args) { Map<String,String> maptest=new HashM ...
- Codeforces Round #367 (Div. 2) D. Vasiliy's Multiset
题目链接:Codeforces Round #367 (Div. 2) D. Vasiliy's Multiset 题意: 给你一些操作,往一个集合插入和删除一些数,然后?x让你找出与x异或后的最大值 ...
- 浙大pat 1031题解
1031. Hello World for U (20) 时间限制 400 ms 内存限制 32000 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue Giv ...
- 2.Math对象
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- Openjudge-计算概论(A)-能被3,5,7整除的数
描述: 输入一个整数,判断它能否被3,5,7整除,并输出以下信息:1.能同时被3,5,7整除(直接输出3 5 7,每个数中间一个空格):2.能被其中两个数整除(输出两个数,小的在前,大的在后.例如:3 ...
- 获取android源码中遇到的问题
最近项目相当紧张,回家之后还需要继续研究android源码. 从网上找了一些资料,下载过程中还是遇到了很多问题.这里罗列一下: 1. 下载Repo过程中提示证书问题: curl https://dl- ...
- iOS页面间传值的六种方式
一般ios页面间的传值方式分为6种:1.属性传值:2.block:3.delegate:4.UserDefault:5.单例:6.通知. 0&1.block 先说我最常用的block吧,属性传 ...
- 2015 Multi-University Training Contest 10
1001 CRB and Apple 1002 CRB and Candies 1003 CRB and Farm 1004 CRB and Graph 1005 CRB and His Birthd ...
- ubuntn安装五笔输入法
1.首先要把原来的 ibus 卸载掉 sudo apt-get remove ibus 2.添加源 sudo add-apt-repository ppa:fcitx-t(www.111cn.net) ...