0

私はこれをLESSで（JSバージョンを使用して）行おうとしています：-

.gradient-horizontal (@from, @to, @fallback)
{    
    background: -webkit-gradient(linear, left top, right top, from(@from), to(@to)); /* for webkit browsers */
    background: -moz-linear-gradient(left,  @from,  @to); /* for firefox 3.6+ */

    filter:      progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='@from', endColorstr='@to'); /* IE6 & IE7 */
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='@from', endColorstr='@to')"; /* IE8 */
}

FirefoxとChromeでは正常に機能しているようです。IE行の@fromと@toをリテラル色に置き換えると機能しますが、上記のように、@fromと@toは変更されずに渡されているように見えます。一重引用符で囲まれている場合。ただし、IEコードはそれらなしでは機能しません。

これを回避する方法はありますか？

4

1 に答える 1

3

これはうまくいくようです：-

.gradient-horizontal (@from, @to, @fallback)
{   

    background: @fallback; /* for non-css3 browsers */
    background: -webkit-gradient(linear, left top, right top, from(@from), to(@to)); /* for webkit browsers */
    background: -moz-linear-gradient(left,  @from,  @to); /* for firefox 3.6+ */

    filter:  ~"progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='@{from}', endColorstr='@{to}')"; /* IE6 & IE7 */
    -ms-filter: ~"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='@{from}', endColorstr='@{to}')"; /* IE8 */
}
于 2012-10-04T17:57:42.330 に答える