Question

我正在尝试添加分为3个部分的背景。左边5％灰色，白色，右边5％灰色......

所以我用CSS创建了一个渐变，这在Chrome中部分没问题，但在IE中根本不起作用......

你会如何创造我正在寻找的效果？

Answer 1

CSS Gradients由于缺乏平台上的光泽支持而可能造成严重破坏。你很可能想在你的问题的评论中做@Louis提到的div方法。这样的事情可以奏效：

 <body>
 <div class="left"></div>
 <div class="center"></div>
 <div class="right"></div>
 <style>
 .left, .right{
     width:5%;
     background:gray;
     height:100%;
     float:left;
     margin:0;
 }
 .center{
     width:90%;
     background:white;
     height:100%;
     float:left;
     margin:0;
 }
 </style>
 </body>

Answer 2

这个网站将帮助您创建css渐变 http://gradients.glrzad.com/ 也尝试在IE中运行它在最新的IE浏览器中支持渐变，但我认为不适用于旧的。另一种解决方案是制作自己设计的照片图像并将其用作背景图像。

Answer 3

Css gradient：

<div class="container"></div>

css太长了，请查看 fiddle 这个适用于IE 9。

另一种选择：

<div class="container">
    <div class="white"></div>
</div>

<style>
body {  background: blue;}
.container {
    height: 50px;
    background: gray;
}
.white {
    height: 50px;
    background: white;
    margin: 0 5%;
}
</style>

<强> Fiddle

背景有1种以上的颜色

3 个答案: