一、表格的常用属性
基本属性有: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. 分享给大家一个简单的数据导出excel类

    <?php /** * 生成excel文件操作 * * @author wesley wu * @date 2013.12.9 */ class Excel { private $limit = ...

  2. java web应用程序目录

    WEB-INF是用来存储服务端配置文件信息和在服务端运行的类文件的,它下面的东西不允许客户端直接访问的.

  3. Linux入门(三)搭建服务器linux运行环境LAMP/LNMP

    本文内容主要根据慕课网教学视频整理,原链接http://www.imooc.com/learn/170 我用的linux系统是ubuntu 12.04 LTS  虚拟机是VMware Workstat ...

  4. Java 集合 LinkedList的ListIterator

    Java 集合 LinkedList的ListIterator @author ixenos 摘要:ListIterator<E>是继承自Iterator<E>的接口.list ...

  5. hdu_5036_Explosion(bitset优化传递闭包)

    题目链接:hdu_5036_Explosion 题意: 一个人要打开或者用炸弹砸开所有的门,每个门里面有一些钥匙,一个钥匙对应一个门,有了一个门的钥匙就能打开相应的门,告诉每个门里面有哪些门的钥匙,问 ...

  6. sqlplus登录Oracle时ORA-01017: invalid username/password; logon denied的错误

    今天用scott用户登录Oracle数 据库时,竟然出现了ORA-01017: invalid username/password; logon denied错误,原以为是因为我的scott用户没有解 ...

  7. JAVASCRIPT 框架>>

    jQuery jQueryjQuery 是目前最受欢迎的 JavaScript 框架 jQuery 是为处理 HTML 事件而特别设计的<script type="text/javas ...

  8. OC类的本质及分类

    (一)类的本质 类对象(class object)与实例对象(instance object) 类本身也是一个对象,是class类型的对象,简称“类对象”. 在/usr/include/objc/ob ...

  9. Erlang OTP gen_event

    转自:http://www.myexception.cn/program/1569725.html Erlang OTP gen_event (0) 原英文文档:http://www.erlang.o ...

  10. HttpClient模拟get,post请求并发送请求参数(json等)

    import java.io.IOException; import net.sf.json.JSONArray; import net.sf.json.JSONObject; import org. ...