`
lichengyezi
  • 浏览: 203585 次
  • 性别: Icon_minigender_1
  • 来自: 齐齐哈尔
文章分类
社区版块
存档分类
最新评论

三种细边框表格的实现方法比较

阅读更多

1.背景设置式-细边框表格

<html>
<head>
  <title>背景设置式-细边框表格</title>
</head>
<body>
  <table width="200" border="0" cellpadding="2" cellspacing="1" bgcolor="#000000">
    <tr>
      <th bgcolor="#FFFFEE" colspan="2">背景设置式-细边框表格</th>
    </tr>
    <tr>
      <td bgcolor="#FFFFEE">text</td>
      <td bgcolor="#FFFFEE">text</td>
    </tr>
    <tr>
      <td bgcolor="#FFFFEE">text</td>
      <td bgcolor="#FFFFEE">text</td>
    </tr>
  </table>
</body>
</html>

 

2.边框设置式-细边框表格

<html>
<head>
  <title>边框设置式-细边框表格</title>
</head>
<body>
  <table width="200" border="1" cellpadding="2" cellspacing="0" bordercolorlight="#000000" bordercolordark="#FFFFFF" bgcolor="#FFFFEE">
    <tr>
      <th colspan="2">边框设置式-细边框表格</th>
    </tr>
    <tr>
      <td>text</td>
      <td>text</td>
    </tr>
    <tr>
      <td>text</td>
      <td>text</td>
    </tr>
  </table>
</body>
</html>

 

3.CSS 层叠式-细边框表格

<html>
<head>
  <title>CSS 层叠式-细边框表格</title>
<style type="text/css">
<!--
.T_Sample {}{
  border-collapse: collapse;
  border: none;
  background: #FFFFEE;
}
.T_Sample th {}{
  border: solid 1px #000000;
}
.T_Sample td {}{
  border: solid 1px #000000;
}
-->
</style>
</head>
<body>
  <table width="200" border="1" cellpadding="2" cellspacing="0" class="T_Sample">
    <tr>
      <th colspan="2">CSS 层叠式-细边框表格</th>
    </tr>
    <tr>
      <td>text</td>
      <td>text</td>
    </tr>
    <tr>
      <td>text</td>
      <td>text</td>
    </tr>
  </table>
</body>
</html>

 

分享到:
评论

相关推荐

    CSS实现表格细边框的两种方法

    这里介绍2种常见的表格细边框制作方法,均通过XHTML验证。 复制代码代码如下: &lt;!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd...

    css控制表格细边框样式

    表格边框的粗细在css中可以轻松实现,不会的朋友可以参考下

    计算机应用基础08-任务3-教案-27.pdf

    三、具体实现(总计 75 分钟) (讲解法、提问法、示范法) (1)美化文字 插入标题:合并居中 设置数字格式:百分比、小数、日期 设置文字格式:字体、颜色、加粗、字号 设置工作表标签 (2)美化表格 自动换行 ...

    Java开发实战1200例(第1卷).(清华出版.李钟尉.陈丹丹).part3

    实例133 使用方法实现线程同步 172 实例134 使用代码块实现线程同步 174 实例135 使用特殊域变量实现线程同步 175 实例136 使用重入锁实现线程同步 176 实例137 使用线程局部变量实现线程同步 177 实例138 简单的...

    android 开发教程之日历项目实践(三)

    日历显示的表格线,使用 Cell 填充图形的边框来实现,为了统一,我们先定义边框线的颜色及线条精细。 另外还要定义一系统填充样式等。 创建 color: color_calendar_border 表格线color_calendar_title_gregorian ...

    asp.net知识库

    在ASP.Net中两种利用CSS实现多界面的方法 如何在客户端调用服务端代码 页面一postback,它就显示页面的最顶端,怎样让它定位在某一位置? 如何保证页面刷新后的滚动条位置 清除网页历史记录,屏蔽后退按钮! 如何传值...

    2018计算机应用基础.doc

    三种方法: 1. 利用"动作设置"创建超链接。 2. 利用"超链接"按钮创建超链接。 3. 利用"动作"按钮来创建超链接。 4.在哪个菜单的哪个选项中添加Word分页符和分节符?分节符和分页符有什么作用? 答: "插入"菜单里的...

    计算机应用基础答案(1).doc

    而具设置的线可粗可细 ,可实可虚,可红可绿,每一个格子的四个边线都可以不一样,可以弄得比较漂亮。同 时每个格子的底色也是可以设置的,在工具栏上直接有按钮,很方便,自己找找文字的 颜色,字体,加粗等都可以...

    《计算机应用基础》.doc

    而具设置的线可粗可细,可实可虚,可红可绿, 每一个格子的四个边线都可以不一样,可以弄得比较漂亮。同时每个格子的底色也是可 以设置的,在工具栏上直接有按钮,很方便,自己找找(文字的颜色,字体,加粗等都 ...

    JavaScript实用范例词典04-14

    7.17 鼠标经过时改变一行表格的颜色... 212 7.18 网页弹出菜单... 213 7.19 网页下拉式菜单... 215 7.20 网页树形目录... 216 7.21 取得按键的ASCII编码... 218 7.22 取得按下的按键... 219 7.23 给网页设定...

Global site tag (gtag.js) - Google Analytics