利用css3和html5打造炫酷斜杠分层效果
本文将演示如何高效地使用CSS3和HTML5创建如上图所示的斜杠分层视觉效果。 多种方法可实现此效果，例如使用伪元素构建三角形叠加、旋转倾斜元素，以及本文推荐的——更简洁且兼容性更佳的线性渐变方法。
以下CSS代码利用线性渐变巧妙地模拟出斜杠分层效果：
eMart 网店系统
下载
功能列表：底层程序与前台页面分离的效果，对页面的修改无需改动任何程序代码。完善的标签系统，支持自定义标签，公用标签，快捷标签，动态标签，静态标签等等，支持标签内的vbs语法，原则上运用这些标签可以制作出任何想要的页面效果。兼容原来的栏目系统，可以很方便的插入一个栏目或者一个栏目组到页面的任何位置。底层模版解析程序具有非常高的效率，稳定性和容错性，即使模版中有错误的标签也不会影响页面的显示。所有的标
/* 左侧斜杠 */
.left {
width: 100%;
height: 100%;
background: linear-gradient(to left, #000 0%, #fff 100%);
}
/* 右侧斜杠 */
.right {
width: 100%;
height: 100%;
background: linear-gradient(to right, #000 0%, #fff 100%);
}
通过简单的线性渐变，即可轻松实现图中所示的视觉效果。 (实际示例链接请参考原文)
