用CSS设置表格Table的细边框的比较好用的方法

伤害是别人带来的,开心是自己寻找的,想哭就哭,哭完了接着笑,没有人能把谁的幸福没收。
设置Table的细边框通常有这么几种方式:

1、设置边框的BORDER=0 、cellspacing=1,设置Table的背景色为所要的边框色,再设置所有的td背景色为白色,这样细边框就显露出来了。这个方法有些邪气,看似不太正宗,但是也能达到效果,条条大路通罗马嘛!

再来看看第二种方法:

来源:(http://blog.sina.com.cn/s/blog_565812e60100czbn.html) - Css : 用CSS设置Table的细边框的几种方法_Lily_新浪博客
2、设置BORDER=0 ,再通过CSS,给Table加上1px的border-top,border-left,然后再设置所有的td的border-right,border-bottom,这样也能达到所要的效果。可见CSS很是强大啊。

今天在实践过程中发现,以上两种方式生成的HTML在Word中打开则发生问题,不能达到预期效果。怎么办呢!?

下面介绍一种更为简便有效的方法:

3、设置table的CSS为{border-collapse:collapse;border:none;},再设置td的CSS为{border:solid #000 1px;},大功告成!而且Word也能认出这种设置。

我发现设置table的CSS为{border-collapse:collapse;border:none;},再设置td的CSS为{border:solid#000 1px;}是一个非常不错的方法。
示例:
<script language="JavaScript">ffcod = delpost.runcode1 .value; ffcod = ffcod.replace(/
/g,''); delpost.runcode1 .value = ffcod;</script> 提示:您可以先修改部分代码再运行

本文用CSS设置表格Table的细边框的比较好用的方法到此结束。吸取教训是健康的做法,这是个人成长过程中的必要环节。悔恨则是一种不健康的心理。这是白白浪费自我目前的精力。小编再次感谢大家对我们的支持!

您可能有感兴趣的文章
RoundedCornr 生成圆角图片的好用的简单工具

css让页脚保持在底部位置的四种方案

Flex布局史上最简单使用语法教程

新的CSS 伪类函数 :is() 和 :where()示例详解

纯CSS打字动画的如何实现示例