我有两列可以伸展到可变高度,设计师希望在两列之间有一个阴影,但正如你所看到的那样,图像在顶部和底部淡出.这意味着我不能只使用在右侧列中左对齐的css使用背景图像.
那么我可能会使用具有径向渐变的css 3边框阴影.我可能会使用表格单元格来执行此操作,因为我需要将阴影拉伸到最高列的高度.我该怎么做呢?
解决方法
以前的答案并没有真正回答你的问题:“如何创建径向
css3边框渐变阴影”
您可以使用径向渐变来模拟没有图像的边框阴影.
演示:http://jsfiddle.net/sonic1980/wRuaZ/
background: -webkit-radial-gradient(50% 0%,50% 5px,#aaa 0%,white 100%); | | | | | | | +--> color end | | +--> color start | +--> size of gradient ellipse (x-axis,y-axis) +---> position of ellipse center
可以很容易地修改它以使其垂直或使用:在伪类之前或之后实现.
另一个例子是< hr>.带阴影的标签:http://jsfiddle.net/sonic1980/65Hfc/