看看这个:
@L_301_0@
我用这个CSS实现了它:
background-image: radial-gradient(#CCC,#FFF),radial-gradient(#CCC,#FFF); background-size: 2px 100%; background-position: 0 0,100% 0; background-repeat: no-repeat;
这是可能的,但模拟的边界将是顶部和底部,而不是左和右?
非常感谢!
解决方法
你想要这样的东西吗?
Demo(有些呼吸空间为您的内容,我已经使用了边距,只要确保它将适用于以下两者之间:以及之前:所以如果你想分开,分别为每个声明边界,ps – 我使颜色更轻)
/* Using only background gradients */ .one { width: 400px; padding: 20px 25px; margin: 40px auto; } .one:before,.one:after { content: ""; height: 1px; /* I've removed the vendor prefixes,if you are looking to support older browsers then refer to older version of this answer. */ background: linear-gradient(to right,rgba(0,0) 0%,rgba(147,147,1) 50%,0) 100%); display: block; margin-bottom: 10px; margin-top: 10px; }
说明:我已经使用过:之前和之后:伪有内容:“”,所以它创建一个块,你可以在元素内部说一个虚拟块,并进一步设置为显示:block,只要确保你使用块还有边距和高度都没有效果..最后但并非最不重要的一点是使用rgba的渐变来控制渐变渐变的alpha / opacity