less 里面 opacity的写法

今天写了个opacity, 竟然less编译不过,上网搜了一个写法

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

in dotless 1.2.3
.opacity (@opacity) {
    @opacityPercentage: @opacity * 100;
    opacity: @opacity;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=(@opacityPercentage));
    filter: alpha(opacity = (@opacityPercentage));
}

less 里面 opacity的写法

时间: 2024-11-10 00:07:07

less 里面 opacity的写法的相关文章

opacity兼容写法

1 .opacity{ 2 position: absolute; 3 top: 0px;left: 0px; 4 background: #000; 5 filter:alpha(opacity=50); /* IE */ 6 -moz-opacity:0.5; /* 老版Mozilla */ 7 -khtml-opacity:0.5; /* 老版Safari */ 8 opacity: 0.5; /* 支持opacity的浏览器*/ 9 } Js写法 1 object.filter = "a

烦人的IE7、8,半透明滤镜(filter:alpha)失效、png半透明失效的解决办法

在项目中的问题,之前用的是用IETest测试IE7,8发现背景透明设置无效,后来找文章解决!看了一些资料,做下总结. 几种IE半透明CSS样式 IE8里可以这样写 -ms-filter:”progid:DXImageTransform.Microsoft.Alpha(opacity=50)”; IE7里可以这样写 filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); IE6,IE7,IE8里都可以这样写 filter:alpha(

透明度兼容性写法

透明度兼容性写法: 低版本IE: 1 filter:alpha(opacity:80); 其他标准浏览器(ff chrome 高版本IE) 1 opacity:0.8;

关于opacity透明度子元素继承现象的若干研究以及hack方法

[感想]信息时代的信息是有时效性的,今天是确确实实感受到了.互联网资料虽然丰富,但是质量不一,还有大量的跟风雷同,很多人都是随手拷贝过来,根本没有实践.以前端为例,这两年浏览器的迅猛发展,造成很多原有知识的失效.但是网上还是大量充斥了以前失效的解决方案.我觉得,我们应本着实践精神,对任何问题的解决方案进行实际测试.须知:纸上得来终觉浅,绝知此事要躬行. 今天遇到一个关于透明度的问题. 大家都知道在css3中增加的新属性opacity——不透明度的设定. 使用了opacity的元素,它的不透明度会

透明度的兼容写法

css透明度的兼容性写法: 1 filter: Alpha(opacity=10); /* IE */ 2 -moz-opacity:0.1; /* 兼容老版本的FF */ 3 opacity:0.1; /* 现代浏览器 */ 比较常用,前端开发人员必须记住.

css兼容性写法大全

常见的浏览器内核引擎以及具体应用: Trident: IE: Gecko: Firefox: webkit: Safari,Google Chrome,遨游3,猎豹,百度: Presto:Opera--Opera mini 书写顺序:firefox,IE8,IE7,IE6 IE6:*,_ IE7:*,+ IE8:\9,\0 chrome:-webkit- firefox:-moz-,root(仅ff认) *        , ie6,ie7可以识别: _和- ,  ie6可以识别: !impor

css3——transition属性和opacity属性

[transition-duration] 是一个css3属性,规定完成过度效果需要花费的时间(一秒或毫秒计).语法:transition-duration: time;time :    规定完成过渡效果需要花费的时间(以秒或毫秒计). 默认值是 0,意味着不会有效果. 该属性其实是transition属性的一个子属性,下面总结一下css3中的transition属性:[transition] 用于在一定的时间内平滑的过度,这种效果可以在鼠标单击,获取焦点,被点击或对元素任何改变中触发,并圆滑

可拖动弹窗的JS和jQuery两种写法

最近在慕课网上学习了一个网页可拖动对话框js实现的演示视频,这个demo中的例子是百度首页登录按钮的弹窗,如下图: 当点击左上角的登录按钮时,弹窗出现并自动居中,同时窗口可拖动的范围被限制在了可视区域内,即浏览器视窗的上下左右边界,弹窗无法移出移动出四个边界,也不会出现滚动条. 另一个效果就是,当改变窗口大小时,对话框自动居中. 这个视频中用了原生js,jQuery两种写法实现案例,但本质上,对话框居中,限制拖动范围的的计算思路是一致的. 为了简化页面,总结核心思路,我重新写了一个小demo,界

CSS3常用功能的写法

随着浏览器的升级,CSS3已经可以投入实际应用了. 但是,不同的浏览器有不同的CSS3实现,兼容性是一个大问题.上周的YDN介绍了CSS3 Please网站,该网站总结了一些常用功能的写法. 以下就是这些写法的详细介绍.所有代码都经过了Firefox 3.6和IE 8.0的验证,原文的错误之处也已得到改正. 一.圆角(Rounded Corner) .box_round { -moz-border-radius: 30px; /* FF1+ */ -webkit-border-radius: 3