我正在为网站制作新的布局,我非常接近实现我想要的结果.但是,有一个问题.我正在使用这里描述的技术的改编(http://nicolasgallagher.com/multiple-backgrounds-and-borders-with-css2/demo/backgrounds.html,参见大猩猩下面的3栏示例).基本上,我的版本使用绝对定位的CSS伪元素作为左列的背景.
当我尝试将一个box-shadow应用于伪元素时,我的问题出现了.元素及其阴影始终显示在我的主列顶部.
为了使所有这一切更清楚,我在这里创建了一个简单的示例页面:http://www.3strandsmarketing.com/test4.html
我担心的是,因为我正在使用基于我的主列的父元素的伪元素,所以它永远不能坐在它下面,但我希望有一些方法可以解决这个问题.有任何想法吗?
好的,这里的解决方案是主列不使用半透明(rgba)颜色。否则,您将能够透过它看到侧边栏列的投影,从而破坏了一个在另一个之上的效果。
要查看正确的效果,请访问示例页面,并使用 Firebug 或其他 DOM 操作工具将 div 的背景颜色#main-content从更改rgba(0, 100, 0, 0.2)为rgba(0, 100, 0, 1)。您现在应该看到它确实位于左侧栏的“顶部”。
| 归档时间: |
|
| 查看次数: |
811 次 |
| 最近记录: |