`
happy100583
  • 浏览: 121757 次
  • 性别: Icon_minigender_1
  • 来自: 长沙
社区版块
存档分类
最新评论

CSS制作table细线表格

    博客分类:
  • CSS
阅读更多

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Css制作table细线表格</title>
<style type="text/css" media="screen">
<!-- /* PR-CSS */
table {
border-collapse:collapse; /* 关键属性:合并表格内外边框(其实表格边框有2px,外面1px,里面还有1px哦) */
border:solid #999; /* 设置边框属性;样式(solid=实线)、颜色(#999=灰) */
border-width:1px 0 0 1px; /* 设置边框状粗细:上 右 下 左 = 对应:1px 0 0 1px */
}
table caption {font-size:14px;font-weight:bolder;}
table th,table td {border:solid #999;border-width:0 1px 1px 0;padding:2px;}
tfoot td {text-align:center;}
-->
</style>
</head>

<body>
<table>
<caption>表格头</caption>
<thead>
<tr><th>名称</th><th>网址</th><th>时间</th></tr>
</thead>
<tbody>
<tfoot>
<tr><td colspan="3">下一页</td></tr>
</tfoot>
<tr><th>百度</th><td>http://www.baidu.com</td><td>2007.01.11</td></tr>
<tr><th>百度</th><td>http://www.baidu.com</td><td>2007.01.11</td></tr>
<tr><th>百度</th><td>http://www.baidu.com</td><td>2007.01.11</td></tr>
</tbody>
</table>
</body>
</html>

分享到:
评论

相关推荐

    css 细线表格 css制作table细线表格常用属性

    Css制作table细线表格 1、介绍了一个不常用属性:border-collapse:collapse; 2、使用了一个属性缩写技巧:border:style color;border-width:上 右 下 左; &lt;!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 ...

    利用CSS生成精美细线Table表格

    NULL 博文链接:https://javapub.iteye.com/blog/733910

    利用CSS生成精美细线Table表格无需复杂style代码

    很多时候利用复杂style代码,来生成这样的表格,造成了页面的修改性和可读性都非常差。这里推荐使用css来产生一个细线表格,感兴趣的朋友可以了解下

    CSS制作符合网站标准的细线表格

    css教程:实现符合Web标准的细线表格  随着应用CSS网页布局构建网页, 以及web标准的广泛普及与发展, 表格渐渐被人们遗忘, 但是表格还是有它优秀的一面, 数据处理用表格的确省了不少麻烦! 这个是细表格的...

    css创意ul+li实现的细线表格实现代码

    非常用创意的用ul+li实现的细线表格效果,不用table

    兼容浏览器的css网页细线表格设计

    常见的做法是利用 CSS2 的 "border-collapse:collapse;" 属性合并表格边框;并对 table 元素设置左边框和上边框,对 th 和 td 元素设置右边框和下边框。 Markup: 复制代码代码如下: &lt;table&gt; &lt;tr&gt; &lt;th&gt;table head ...

    CSS去除表格的默认间距并且制作1px的细线表

    现在在所谓“div css”的风气下,很多人放弃了表格,其实应该让每个标签物尽其用,在表现数据的地方,我们还是应该使用table。但是,我们在建立table的时候,会发现它会具有一些默认的样式,比如单元格td之间会有...

    js使用小技巧

    交换表的行 TableID.moveRow(2,1) 替换CSS document.all.csss.href = "a.css"; 并排显示 display:inline 隐藏焦点 hidefocus=true 根据宽度换行 style="word-break:break-all" 自动刷新 ;URL=...

Global site tag (gtag.js) - Google Analytics