渐变边界底部ie10 asp.net的麻烦

时间:2014-03-12 15:31:02

标签: asp.net css internet-explorer gradient

为什么此代码在IE10中正常运行?

<HTML><HEAD>
<STYLE type="text/css">

ul{
    padding:0;
    margin:0;
}
sectionHeader{
    margin-left:20px;
    width:200px;
    list-style:none;
    border-bottom:dashed 1px #99f;
    color:#99f;
    position:relative;
}

sectionHeader:after{
     content: '';
        position: absolute;
        height: 2px;
        width: 100%;
        top: 100%;
        color: red;
        left: 0;
        background: -moz-linear-gradient(right, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, right top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(right, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(right, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(right, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
        background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C */
}
</STYLE>

<META name="GENERATOR" content="MSHTML 10.00.9200.16798"></HEAD>
<BODY> 
<DIV class="sectionHeader">
<UL>
  <LI>Link 1</LI>
  <LI>Link 2</LI>
  <LI>Link 3</LI></UL></DIV></BODY></HTML>

但是当我在我的asp.net应用程序中的Main.CSS中定义SectionHeader时,它无法正常工作。浏览器仅显示没有渐变的边框。 抱歉可怕的英语。

0 个答案:

没有答案