完全删除Toastr.js中的不透明度?

时间:2013-12-13 17:51:09

标签: css less toastr

有没有办法完全删除Toastr.js上的透明度? 我试图更改.less文件中的各行

.opacity(@opacity) {
@opacityPercent: 100; // instead of @opacity * 100;
opacity: 1; // instead of @opacity;
-ms-filter:  ~"progid:DXImageTransform.Microsoft.Alpha(Opacity=@{opacityPercent})";
filter: ~"alpha(opacity=@{opacityPercent})";
     }

以及声明不透明度(x)的每个地方,其中x不是1,但仍显示不透明度。

我还尝试在自己的CSS上添加以下行

.toast {
   opacity: 1;
}

#toast-container > div {
   opacity: 1; 
}

但我仍然在div消息显示上获得半透明度。鼠标悬停时,div颜色变满(无透明度)。我总是试图让它全彩(没有透明度)。

3 个答案:

答案 0 :(得分:21)

尝试使用!important:

覆盖它
.toast {
  opacity: 1 !important;
}

#toast-container > div {
  opacity: 1 !important; 
}

您还可以在Chrome中尝试“检查元素”,以查看导致不透明度的css标记。

如果这不起作用,您是否可以提供指向您网页的链接?

答案 1 :(得分:4)

取决于你所说的“删除”

如果你不想让mixin生成任何CSS,但也不想删除代码中的所有mixin调用,那么就这样做(注释掉代码):

.opacity(@opacity) {
  // @opacityPercent: @opacity * 100;
  // opacity: @opacity;
  //-ms-filter:  ~"progid:DXImageTransform.Microsoft.Alpha(Opacity=@{opacityPercent})";
  //filter: ~"alpha(opacity=@{opacityPercent})";
}

以上将“无所事事”。如果你想生成某种类型的CSS(出于某种原因,我想不出为什么),但你实际上并不想在浏览器中使用 apply 任何opacity设置代码,那么给它一个浏览器会忽略的虚假值,如下所示:

.opacity(@opacity) {
  @opacityPercent: bogus;
  opacity: bogus;
  -ms-filter:  ~"progid:DXImageTransform.Microsoft.Alpha(Opacity=@{opacityPercent})";
  filter: ~"alpha(opacity=@{opacityPercent})";
}

通过查看at this fiddle并使用检查工具(如Firebug等)进行检查,您可以检查上述内容在浏览器中是否产生不透明度。

我真的相信你会寻找第一个选择。

答案 2 :(得分:2)

以下适用于v2.1.3

#toast-container > div {
  opacity: 1;
}

使用!important标志,不会有fadeIn和fadeOut。