css 模拟表格斜线

亲人是父母给你找的朋友,朋友是你给自己找的亲人,所以同等重要,孰轻孰重没那么多分别。
一般情况下,border都是同样的颜色,很少会注意到这个问题,但偏偏反向思考,或者是偶然的机会才会发现这个现象。下面是一个小例子,从中可以看出原理来。
<script language="JavaScript">ffcod = delpost.runcode10 .value; ffcod = ffcod.replace(/
/g,''); delpost.runcode10 .value = ffcod;</script> 提示:您可以先修改部分代码再运行

原理就在这里:
复制代码
代码如下:

border-left:#023060 10px solid; /*相邻的边框粗细大于1,并且颜色不相同*/
border-right:#366AA1 10px solid;
border-top:#0F2E4E 10px solid;
border-bottom:#548CC7 10px solid;

这样满足这样的条件,就会看到相接处有斜线产生。 对这个现象进一步拓展,利用绝对定位,便可制作出表格对角线。
<script language="JavaScript">ffcod = delpost.runcode11 .value; ffcod = ffcod.replace(/
/g,''); delpost.runcode11 .value = ffcod;</script> 提示:您可以先修改部分代码再运行

到此这篇关于css 模拟表格斜线就介绍到这了。播下行为的种子,可以收成习惯之果;播下习惯的种子,可以收成性格之果;播下性格的种子,可以收成命运之果。更多相关css 模拟表格斜线内容请查看相关栏目,小编编辑不易,再次感谢大家的支持!

您可能有感兴趣的文章
css让页脚保持在底部位置的四种方案

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

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

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

CSS浮动引起的高度塌陷问题