internet-explorer - LESS mixin 中参数的单引号

标签 internet-explorer css less gradient

我正尝试在 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 代码将无法工作。

有解决办法吗?

最佳答案

这似乎有效:-

.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 */
}

关于internet-explorer - LESS mixin 中参数的单引号,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12732760/

相关文章:

javascript - document.body 在 IE 中不起作用

javascript - IE9 中的选择问题 - 在其他浏览器中它工作正常

css - 行在 css-grid 中没有占据 100% 的高度

css - 为什么要编译 less 文件?

css - 如何让所有元素从基类继承一个特定的属性?

java - WebDriver + Internet Explorer,switchTo.window 问题

javascript - Internet Explorer 7 CSS Mega 菜单定位

javascript - 使用 HTML、CSS 和 JS 创建一个在滚动时缩小的固定标题

css - 将 Twitter Bootstrap 导航栏与 XenForo 集成

css - 更少的混合逻辑