一、表格的常用属性
基本属性有: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边框设置的更多相关文章

  1. table边框不显示

    今日在做报表的时候发现,最后一行隐藏后整个报表的下边框会不显示,猜测是td的边框隐藏后但table并未设置边框,导致下边框没有出现.因此设置了table边框后问题解决.table和td的边框关系如下实 ...

  2. 解决table边框在打印中不显示的问题

    先了解一下,table边框如何设置 一.只对表格table标签设置边框 只对table标签设置border(边框)样式,将让此表格最外层table一个边框,而表格内部不产生边框样式.CSS代码: .t ...

  3. HTML小技巧将table边框改为细线

    HTML制作新手在用TABLE表格时,会碰到如何改变边线粗线,因为默认的TABLE边线设置即使是1px 是很粗的.因此会使用其他一些方法来制作出细线边框,这里介绍一种利用CSS来实现细线的方法,很有效 ...

  4. table 边框问题

    对table设置css样式边框,分为几种情况:1.只对table设置边框2.对td设置边框3.对table和td技巧性设置表格边框4.对table和td设置背景,实现完美表格边框 以下DIVCSS5对 ...

  5. 借助JavaScript中的Dom属性改变Html中Table边框的颜色

    借助JavaScript中的Dom属性改变Html中Table边框的颜色 -------------------- <html> <head> <title>我是页 ...

  6. 借助JavaScript中的时间函数改变Html中Table边框的颜色

    借助JavaScript中的时间函数改变Html中Table边框的颜色 <html> <head> <meta http-equiv="Content-Type ...

  7. Qt QGroupBox StyleSheet 边框设置

    /**************************************************************************** * Qt QGroupBox StyleSh ...

  8. Table样式设置

    <table class="listTable"> <tr><th width="40px">序号</th>&l ...

  9. 表格Table宽度设置无效的解决方法

    表格Table宽度设置无效的解决方法 bootstrap中使用table时发现不管用width赋值方式都无法改变table>td的宽度 解决方法: 设置table:table-layout:fi ...

随机推荐

  1. php基础八(cookie)

    cookie 常用于识别用户.cookie 是服务器留在用户计算机中的小文件.每当相同的计算机通过浏览器请求页面时,它同时会发送 cookie.通过 PHP,您能够创建并取回 cookie 的值. 如 ...

  2. map 理解

    键值对 map会将同名的值覆盖掉 public static void main(String[] args) { Map<String,String> maptest=new HashM ...

  3. Codeforces Round #367 (Div. 2) D. Vasiliy's Multiset

    题目链接:Codeforces Round #367 (Div. 2) D. Vasiliy's Multiset 题意: 给你一些操作,往一个集合插入和删除一些数,然后?x让你找出与x异或后的最大值 ...

  4. 浙大pat 1031题解

    1031. Hello World for U (20) 时间限制 400 ms 内存限制 32000 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue Giv ...

  5. 2.Math对象

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. Openjudge-计算概论(A)-能被3,5,7整除的数

    描述: 输入一个整数,判断它能否被3,5,7整除,并输出以下信息:1.能同时被3,5,7整除(直接输出3 5 7,每个数中间一个空格):2.能被其中两个数整除(输出两个数,小的在前,大的在后.例如:3 ...

  7. 获取android源码中遇到的问题

    最近项目相当紧张,回家之后还需要继续研究android源码. 从网上找了一些资料,下载过程中还是遇到了很多问题.这里罗列一下: 1. 下载Repo过程中提示证书问题: curl https://dl- ...

  8. iOS页面间传值的六种方式

    一般ios页面间的传值方式分为6种:1.属性传值:2.block:3.delegate:4.UserDefault:5.单例:6.通知. 0&1.block 先说我最常用的block吧,属性传 ...

  9. 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 ...

  10. ubuntn安装五笔输入法

    1.首先要把原来的 ibus 卸载掉 sudo apt-get remove ibus 2.添加源 sudo add-apt-repository ppa:fcitx-t(www.111cn.net) ...