expression是在IE5版本之后支持使用的,用来把CSS属性和Javascript脚本关联起来,【这里的CSS属性可以是元素固有的属性,也可以是自定义属性。】是动态设置CSS属性的强大方法,但也存在着一定的危险性

CSS属性后面可以是一段Javascript表达式,CSS属性的值等于Javascript表达式计算的结果。

在表达式中可以直接引用元素自身的属性和方法,也可以使用其他浏览器对象。这个表达式就好像是在这个元素的一个成员函数中一样。

1,给元素固有属性赋值

 #div{
position:absolute;
left:expression(document.body.offsetWidth-200+"px");
top:expression(document.body.offsetHeight-250+"px");
}

给一个div设置其左边距和上边距。document.body.offsetWidth是当前网页可见区域宽度。

2、给元素自定义属性赋值

用CSS自定义属性Expression对表格行间隔背景批量定义

 <html>
<head>
<title></title>
<style type="text/css">
tr{ bg:expression('#F8F8F8,#EFEFEF'.split(',')[rowIndex%2]); }
</style>
</head>
<body>
<table width="100%" border="0">
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>
</body>
</html>

上面的代码可以实现表格行背景色(#F8F8F8,#EFEFEF)交替出现,不需要每行单独定义。

bg是自己任意定义的属性。在自定义属性与expression之间可别忘了还有一个引号,因为实质还是CSS,所以放在style标签内,而非script内。

注意:

不是非常需要,一般不建议使用expression,因为expression对浏览器资源要求比较高

CSS Expression的问题就在于它的计算频率要比想象的多出很多。不仅仅是在页面显示和缩放时,就是在页面滚动、乃至移动鼠标时都会要重新计算一次。给CSS Expression增加一个计数器可以跟踪表达式的计算频率。在页面中随便移动鼠标都可以轻松达到10000次以上的计算量。

性能优化:

一个减少CSS Expression计算次数的方法就是使用一次性的表达式,它在第一次运行时将结果赋给指定的样式属性,并用这个属性来代替CSS Expression。

CSS Expression还是有很多问题,所以尽量不要使用。

你不知道的css中的expression的更多相关文章

  1. css中的expression

    最近对CSS中的行为比较感兴趣,虽然是不符合标准的也只有ie才能识别,但是他确实给css的功能扩展了不少.下面是摘自互联网上的文字和例子,因为都被转烂了,没法注明出处. IE5及其以后版本支持在CSS ...

  2. CSS中的行为——expression

    IE5及其以后版本支持在CSS中使用expression,用来把CSS属性和Javascript脚本关联起来,这里的CSS属性可以是元素固有的属性,也可以是自定义属性.就是说CSS属性后面可以是一段J ...

  3. ie浏览器css中的行为expression详解

    CSS中的行为——expression (ie only) 最近对CSS中的行为比较感兴趣,虽然是不符合标准的也只有ie才能识别,但是他确实给css的功能扩展了不少.下面是摘自互联网上的文字和例子,因 ...

  4. CSS中表示cellpadding和cellspacing的方法

    本文和大家重点讨论一下用CSS来表示表格的cellpadding和cellspacing方法,表格的cellpadding和cellspacing我们经常会用一定的方式来清除默认样式,请看下文详细介绍 ...

  5. CSS中新属性calc()

    CSS3的calc()使用 原文: http://www.w3cplus.com/css3/how-to-use-css3-calc-function.html © w3cplus.com calc( ...

  6. CSS中的偏僻知识点

    一.css中的calc 在CSS中有calc属性用于尺寸的计算,可以让百分比和像素值进行运算. div {width : calc(100% - 30px);} 为了兼容性 /*Firefox*/ - ...

  7. 优化网站设计(七):避免在CSS中使用表达式

    前言 网站设计的优化是一个很大的话题,有一些通用的原则,也有针对不同开发平台的一些建议.这方面的研究一直没有停止过,我在不同的场合也分享过这样的话题. 作为通用的原则,雅虎的工程师团队曾经给出过35个 ...

  8. 《你不知道的 CSS》之等比例缩放的盒子

    你肯定已经知道,对于一个 img 元素而言,你可以单独地修改它的 width 或者 height 属性来设置它的大小,同时图片的比例还能够保持不变. 如下图所示,最上面是原始大小的图片,下面两张则分别 ...

  9. 一些你不知道的css特性【一】

    浏览器禁止用户在标签的style中使用js写入"!important"的特性 我们在使用jQuery设置css的时候 $('#text').css('height', '200px ...

随机推荐

  1. 【python cookbook】【字符串与文本】4.文本模式的匹配和查找

    问题:按照特定的文本模式进行匹配或查找 解决方法: 1.简单的文字匹配,只需使用str.find().str.startswith().str.endswith()或类似的函数即可: 2.复杂的匹配, ...

  2. 为博客启用MetaWeBlog API

    最近想写一个博客系统,主要有以下几点功能. 能够使用Live Writer来发布.修改文章 使用MongoDB作为持久化 对于博客中的图片.CSS.JS文件,使用CDN加速 后期可加上Radis 使用 ...

  3. struts2-json-plugin插件实现异步通信

    用例需要依赖的jar: struts2-core.jar struts2-convention-plugin.jar,非必须, struts2-json-plugin.jar org.codehaus ...

  4. 启动hadoop报192.168.1.151: Address 192.168.1.151 maps to node1, but this does not map back to the address - POSSIBLE BREAK-IN ATTEMPT!

    使用root用户启动hadoop的时候报错: [root@node1 ~]# su - hadoop -c start-all.sh starting namenode, logging to /ap ...

  5. 利用python进行数据分析 (学习笔记)

    第一章:准备工作 1.重要的Python库 (1)NumPy:Python科学计算的基础包.功能有:

  6. 关于sql server 2008过期导致 MSSQLSERVER服务就无法启动,手动启动就报告错误代码17051。

    1.基本现象:MSSQLSERVER服务就无法启动,手动启动就报告17051错误. 2.解决办法: 第一步:进入SQL2008配置工具中的安装中心, 第二步:再进入维护界面,选择版本升级, 第三步:进 ...

  7. HDU 2665 && POJ 2104(主席树)

    http://poj.org/problem?id=2104 对权值进行建树(这个时候树的叶子是数组b的有序数列),然后二分查找原数列中每个数在有序数列中的位置(即第几小),对每一个前缀[1,i]建一 ...

  8. 【转】利用xcode生成的app生成可以在iphone和itouch上运行的ipa安装包

    转载地址:http://blog.csdn.net/yohunl/article/details/5971252 在编译好的真机版目录下的.app文件,至于生成真机可以运行的app的方法,有两种方式, ...

  9. miniUI子窗口调父窗口方法

    window.Owner.XXX 其中XXX是父窗口里的方法名

  10. Android 自定义ScrollView ListView 体验各种纵向滑动的需求

      分类: [android 进阶之路]2014-08-31 12:59 6190人阅读 评论(10) 收藏 举报 Android自定义ScrollView纵向拖动     转载请标明出处:http: ...