IE 梯度过滤器的 LessCss w/dotLess mixin 问题

标签 less mixins css dotless

我定义了以下 less mixin:

.TopDownActiveGradient(@s1, @s2){ 
background: -moz-linear-gradient(top, @s1 0%, @s2 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,@s1), color-stop(100%,@s2)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, @s1 0%, @s2 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, @s1 0%, @s2 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, @s1 0%, @s2 100%); /* IE10+ */
background: linear-gradient(to bottom, @s1 0%, @s2 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@{s1}', endColorstr='@{s2}'); /* IE6-8 */}

它的用法如下:

.TopDownActiveGradient(#f7f7f7, #fffffe);

现在,当我输入的颜色无法简化为简写版本(例如#dadada)时,它可以正常工作,这意味着如果我使用#ffffff作为可以转换为#fff的颜色,它不会工作,因为 Ie6-8 的过滤器需要全彩色十六进制值。

此问题仅在打开缩小选项时发生。如果我选择不缩小,#ffffff 会变成“白色”,效果很好。

我的问题是如何停止 mixin 中的颜色十六进制代码缩小?或者有什么办法可以绕过这个限制吗?

我尝试了很多方法,但没有任何效果。

最佳答案

对于 8 字符十六进制,此问题已在 dotless main 中修复 - https://github.com/dotless/dotless/commit/52ba9a4ccf4e9a895d557f01112ab4c7f4cad8a7

这是当前版本。

如果您需要 6 个字符的十六进制,您可以尝试使用插值

~“@col”

不过,我不确定它是否有效。

关于IE 梯度过滤器的 LessCss w/dotLess mixin 问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12490418/

相关文章:

windows - 在 Windows 下安装 Node.js 是否有任何安全隐患?

jQuery CSS 类作为 LESS mixins

css - & 作为 LESS 中 mixin 的 sibling

html - <html> 、 <body> 、填充、边距、100vh 和 calc()

less - .less 输出变量不声明

css - 将第三方 css 实现到自己的 less 结构中

sass - 如何在SASS中将mixin作为另一个mixin的参数传递

css - 基础 6 中自定义尺寸的 xy 网格排水沟

css - 页面滚动?也许 z-index?

css - 在 :hover 上保持菜单打开