两侧有两个分区的中心区 - (现有的全部工程)

时间:2013-02-04 08:05:25

标签: css html photoshop

嗯,这是故事。我正在开发我的第一个网站,我遇到的第一个问题是制作主div的圆角,它将包含所有内容。 CSS3是一个很好的解决方案,但与IE6-8的不兼容性阻止了我。

此外,我需要圆角div(它实际上是矩形,950x1600,圆角为30px)以居中并沿着边框有一个漂亮的阴影。

使用背景图片也不是一种选择,因为它计划采用无缝模式。

所以我想做的是:

  1. 放一个居中的div。
  2. 将从photoshop剪下的图像放在角落里
  3. 使用1px高PS图案作为阴影。
  4. 一切都会好的,但'图案'背景会让一切都变得混乱。 因此,我在这里看到的唯一解决方案是在中心div的两侧放置两个div,从右上角右侧绘制一个绘制图案,因此从photoshop切割的边框将与用于背景图像的壁板div无缝匹配。

    现在告诉我,伙计们,我想在这里发明一辆自行车,还是有更好的解决方案?

    P.S。我发现的所有解决方案在某种程度上都是无用的。有些非常接近,但在div周围留下了10px的边缘白色区域。或者在调整到必要的高度和宽度后,不要滚动并掉出页面。带有文本的表没有文本是没用的(不是吗?如果我删除文本就会消失)

    是的,我是一个完全的菜鸟,所以请放纵=)

1 个答案:

答案 0 :(得分:0)

如果您主要关注的是旧版IE中的圆角属性支持,那么可能需要查看CSS3Pie(css3pie.com)这样的插件。这使用了'behavior'属性,所以它不会弄乱你的其他浏览器 - 为90%的当前浏览器添加过时的标记是没有意义的(即设计最低的公分母)。

CSS3 Pie

老实说,我通常会完全放弃旧版本IE中的圆角 - 只要内容优雅地降低,这绝对没有坏处。但是,如果你真的想要一致的外观,我肯定会使用上面的插件,而不是围绕那些应该在很久以前停止使用的浏览器构建你的整个页面。