避免使用CSS表达式】的更多相关文章

一直以来我们被教育说CSS Expression是个坏东西,很影响性能,应该禁止使用,但是如果仔细想想CSS表达式影响性能的原因,规避掉影响性能的写法,CSS表达式还是能给我们带来一些惊喜的.CSS表达式影响性能的原因:CSS表达式会进行频繁的计算(CSS计算的频率要远远超出我们的想象,不仅在页面显示和缩放时,在页面滚动.移动鼠标都会重新计算一次),从而影响到页面的性能.如果浏览器只需要执行一次CSS表达式,那会多Happy啊. /* 解决IE6背景图片不缓存的问题 */ * html body…
项目中用的grunt-contrib-less, 写了以下less代码 .mapfix{ position: fixed; top:10px; width: 430px; z-index: 100; background: #fff; -position:absolute; -top:expression(eval(document.documentElement.scrollTop)); } 注意底部两行是为了兼容IE6,即修复IE6的fixed.IE7+已经支持了. 执行less命令后,报错…
http://www.cnblogs.com/chenxizhang/archive/2013/05/01/3053439.html 这一篇我来和大家讨论个原则:Avoid CSS Expressions  (避免在CSS中使用表达式) 最早的CSS是不支持所谓的表达式的,微软的IE从5.0开始引入了这种概念,意思是希望我们拥有定义动态的CSS样式的能力,详细的文章请参考http://msdn.microsoft.com/en-us/library/ms537634(v=VS.85).aspx,…
/* IE6下最小宽度的CSS表达式 */ width:100%; min-width:1024px; _width:expression((document.documentElement.clientWidth||document.body.clientWidth)<1024?"1024px":""); 模块垂直居中,兼容IE6,注意,模块的所有父辈标签不能有定位属性,不能有overflow:hidden; .duilian_right{width:90p…
IE5及其以后版本支持在CSS中使用expression,用来把CSS属性和Javas cript表达式关联起来,这里的CSS属性可以是元素固有的属性,也可以是自定义属性.就是说CSS属性后面可以是一段Javas cript表达式,CSS属性的值等于Javas cript表达式计算的结果.在表达式中可以直接引用元素自身的属性和方法,也可以使用其他浏览器对象.这个表达式就好像是在这个元素的一个成员函数中一样. 给元素固有属性赋值  例如,你可以依照浏览器的大小来安置一个元素的位置. 以下是引用片段…
css: .wraper{ width:980px; height:2048px; margin:0 auto; background:#ccc; } /*返回头部*/ #backToTop a{;;;} #backToTop .bt_bg{ background:; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://i0.cy.com/xtl/main/20140227/backTop.png',siz…
概述 CSS表达式是动态设置CSS属性的强大(但危险)方法.Internet Explorer从第5个版本开始支持CSS表达式. 兼容性 expression方法在其它浏览器中不起作用,因此在跨浏览器的设计中单独针对Internet Explorer设置时会比较有用. 例子 隔1s切换一次背景颜色 input鼠标移入移出变换背景 body{ background-color: expression( (new Date()).getSeconds()%2 ? "#B8D4FF" : &…
前言 网站设计的优化是一个很大的话题,有一些通用的原则,也有针对不同开发平台的一些建议.这方面的研究一直没有停止过,我在不同的场合也分享过这样的话题. 作为通用的原则,雅虎的工程师团队曾经给出过35个最佳实践.这个列表请参考 Best Practices for Speeding Up Your Web Site  http://developer.yahoo.com/performance/rules.html 同时,他们还发布了一个相应的测试工具Yslow http://developer.…
dynamic-css 使得你可以借助 MVVM 模式动态生成和更新 css,从而将本插件到来之前,打散.嵌套在 js 中的修改样式的代码剥离出来.比如你要做元素跟随鼠标移动,或者根据滚动条位置的变化而触发一些效果,原本你要写 js 去绑定滚动事件,然后计算偏移量,然后更新元素 css,使用 dynamic-css,你只要根据语法去写好 css 表达式就可以了.对于一些原本需要复杂的 js 判断的动态 css,用 dynamic css 表达式几行代码搞定. 举两个例子: 元素跟随鼠标移动 实现…
二.CSS部分 1.解释一下CSS的盒子模型? 回答一:a.标准的css盒子模型:宽度=内容的宽度+边框的宽度+加上内边具的宽度b.网页设计中常听的属性名:内容(content).填充(padding).边框(border).边界(margin), CSS盒子模式都具备这些属性.c.这些属性我们可以把它转移到我们日常生活中的盒子(箱子)上来理解,日常生活中所见的盒子也就是能装东西的一种箱子,也具有这些属性,所以叫它盒子模式.CSS盒子模型就是在网页设计中经常用到的CSS技术所使用的一种思维模型.…