小编dv8*_*hn8的帖子

我在IE9中遇到了一个奇怪的事情,想要显示背景渐变.

基本上我正在将多个类应用于容器对象.

<div class="gradient corners"></div>

使用这个CSS.

.gradient {
background-color: #96A7C5;
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.19, #6C86AD),
color-stop(0.6, #96A7C5)
);
background-image: -moz-linear-gradient(
center bottom,
#75A33A 19%,
#8DC447 60%
);

.corners {
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}

为了获得IE中的渐变,我将过滤器垃圾应用于我的.gradient类.

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#8DC447', endColorstr='#75A33A');

有了它,渐变起作用,但我的圆角消失了.

所以我尝试为过滤器声明设置条件.

<!--[if IE]>
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#8DC447', endColorstr='#75A33A');
<![endif]-->

这带回了我的角落,但渐变消失了.

我有以下CSS来设置一个简单的列表:

ul.menu_list li {
display: inline;
}
ul.menu_list li:after {
content:" | ";
}
ul.menu_list li:last-child  {
content:"";
}

<ul class="menu_list">
  <li><a href="">Link</a></li>
  <li><a href="">Link</a></li>
  <li><a href="">Link</a></li>
</ul>

我得到了理想的效果,除了最后一个孩子没有丢失它的垂直条,"|".

Link | Link | Link |

我尝试过组合:after:last-child&反之亦然,但第一次:声明后总是优先.