一、表格的常用属性
基本属性有: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

    strstr()可以返回匹配的值 echo strstr("localhost", "os");返回ost echo substr_count("gg ...

  2. Sass与Compress实战:第三章

    概要:这一章将介绍Compass如何使Web设计中最基础的部分——布局变得简单. 本章内容: ● 网格布局的基本原理以及何时使用网格布局 ● 使用Compass时的CSS网格布局框架选项 ● 使用排版 ...

  3. Maven项目问题

    Maven项目部署 svn检出的为普通项目 1.普通项目转换为Maven项目: 选择项目右击->Maven4MyEclipse->Update Project 2.tomcat项目空间WE ...

  4. UltraEdit 中的常用正则表达式

    正则表达式 (UltraEdit Syntax):   % 匹配行首 - 表明要搜索的字符串一定在行首.   $ 匹配行尾 - 表明要搜索的字符串一定在行尾   ? 匹配除换行符外的任一单个字符.   ...

  5. hdu 5876 Sparse Graph icpc大连站网络赛 1009 补图最短路

    BFS+链表 代码改自某博客 #include<stdio.h> #include<iostream> #include<algorithm> #include&l ...

  6. C++ 类中的引用成员变量初始化

    刚遇到一个问题,需要的类成员为指针的引用,而引用不能在构造函数里初始化,必须在初始化列表中进行初始化,并且需要该引用在构造函数中的形参必须为引用形式 1: class ThreadParam { 2: ...

  7. automake,autoconf使用详解

    本文地址: http://www.laruence.com/2009/11/18/1154.html 文章转自: http://www.linuxcomputer.cn/ 作为Linux下的程序开发人 ...

  8. Python从json中提取数据

    #json string:s = json.loads('{"name":"test", "type":{"name": ...

  9. display flex 和a标签不行

    父元素display: flex;  display: -webkit-flex; flex-flow: row wrap; -webkit-flex-flow: row wrap; 配合子元素 fl ...

  10. 使用block函数的基本形式

    以前从未接触过block函数. 如果在.h头文件中定义的形式如下的话: @property (nonatomic, copy) void(^fontValueChangedBlock)(void); ...