定义

  IE5及其以后版本支持在CSS中使用expression,用来把CSS属性和Javascript表达式关联起来,这里的CSS属性可以是元素固有的属性,也可以是自定义属性。就是说CSS属性后面可以是一段Javascript表达式,CSS属性的值等于Javascript表达式计算的结果。 在表达式中可以直接引用元素自身的属性和方法,也可以使用其他浏览器对象。这个表达式就好像是在这个元素的一个成员函数中一样。

  给元素固有属性赋值

  例如,你可以依照浏览器的大小来安置一个元素的位置。

#myDiv {
   position:   absolute;
   width:      100px;
   height:     100px;
   left:       expression(document.body.offsetWidth  - 110 + "px");
   top:        expression(document.body.offsetHeight - 110 + "px");
   background: red;
}

  给元素自定义属性赋值

  例如,消除页面上的链接虚线框。 通常的做法是:

<a href="link1.htm" οnfοcus="this.blur()">link1</a>
<a href="link2.htm" οnfοcus="this.blur()">link2</a>
<a href="link3.htm" οnfοcus="this.blur()">link3</a>

  粗看或许还体现不出采用expression的优势,但如果你的页面上有几十甚至上百个链接,这时的你难道还会机械式地Ctrl+C,Ctrl+V么,何况两者一比较,哪个产生的冗余代码更多呢?

  采用expression的做法如下:

<style type="text/css">
a {star : expression(οnfοcus=this.blur)}
</style>
<a href="link1.htm">link1</a>
<a href="link2.htm">link2</a>
<a href="link3.htm">link3</a>

  说明:里面的star就是自己任意定义的属性,你可以随自己喜好另外定义,接着包含在expression()里的语句就是JS脚本,在自定义属性与expression之间可别忘了还有一个引号,因为实质还是CSS,所以放在style标签内,而非script内。OK,这样就很容易地用一句话实现了页面中的链接虚线框的消除。不过你先别得意,如果触发的特效是CSS的属性变化,那么出来的结果会跟你的本意有差别。例如你想随鼠标的移进移出而改变页面中的文本框颜色更改,你可能想当然的会认为应该写为

<style type="text/css">
input
{star : expression(οnmοuseοver=this.style.backgroundColor="#FF0000";
οnmοuseοut=this.style.backgroundColor="#FFFFFF")}
</style>
 <style type="text/css">
 input {star : expression(οnmοuseοver=this.style.backgroundColor="#FF0000";
 οnmοuseοut=this.style.backgroundColor="#FFFFFF")}
 </style>
<input type="text">
<input type="text">
<input type="text">

  可结果却是出现脚本出错,正确的写法应该把CSS样式的定义写进函数内,如下所示:

<style type="text/css">
input {star : expression(οnmοuseοver=function()
{this.style.backgroundColor="#FF0000"},
οnmοuseοut=function(){this.style.backgroundColor="#FFFFFF"}) }
</style>
<input type="text">
<input type="text">
<input type="text">

转载于:https://www.cnblogs.com/gogoo/archive/2007/05/19/752785.html

CSS中expression使用简介(转载)相关推荐

  1. CSS中expression怎么用? CSS expression详解

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

  2. 简单粗暴,微生物生态研究中常用数据库简介--转载

    微生物生态(MicrobialEcology),又名环境微生物(Environmental Microbiology),是研究微生物之间及其与环境之间相互关系的学科.从生物角度,其研究对象主要有真核微 ...

  3. CSS中调用JS函数和变量

    在CSS来调用JS程序. 这个技术是网络安全里的,叫做CSS跨站. 我们知道CSS里是可以控制某些HTML元素的属性的,譬如background-image等等,而在URL里添加Javascript: ...

  4. CSS的expression

    在网上第一次注意到css里有expression这个属性,于是搜索了一下,得到了一下相关知识 贴出来也许对大家有所帮助,感谢原作者的劳动. CSS中expression使用简介 作者:dozb 定义 ...

  5. css中margin详细介绍

    深入理解css中的margin属性 转载自  http://www.cnblogs.com/zhuzhenwei918/p/6124263.html 深入理解css中的margin属性 之前我一直认为 ...

  6. 转载-CSS中强大的EM

    W3CPLUS转载 使用CSS也好久了,但一直都是在使用"px"来设置Web元素的相关属性,未敢使用"em".主要原因是,对其并不什么了解,只知道一点概念性的东 ...

  7. 【Css】css中class之间>(大于号)、~(波浪号)、 (空格)、,(逗号)、+(加号)详解(转载,笔记用)

    css中">"(大于号)."~"(波浪号)." "(空格).","(逗号)."+"(加号)详解 ...

  8. css中hideFocus的用法

    css中hideFocus的用法 简单说:hideFocus是对超链接外虚线框的设定! hideFocus即隐藏聚焦,具有使对象聚焦失效的功能,其功能相当于: onFocus="this.b ...

  9. CSS中的!important属性用法

    由于IE并不严格执行W3C标准, 而又几乎垄断了浏览器市场. 所以作为一名合格的网站制作人员, 必须要针对不同的浏览器进行微调. 实现不同浏览器之间兼容的方法有很多, 比如利用JS探测用户的浏览器类型 ...

最新文章

  1. 现实迷途 第七章 特殊客户
  2. Thinkphp动态切换主题
  3. Mysql中大表添加索引的办法
  4. 【AOP 面向切面编程】Android Studio 使用 AspectJ 监控方法运行 ( 定义连接点注解 | 定义 Aspect 切面 | 定义切入点 | 逐个处理切入点的各个连接点 )
  5. webapck将css 打包后单独提取到一个css文件中
  6. 【机器学习】最近邻算法KNN原理、流程框图、代码实现及优缺点
  7. jQuery学习第一天
  8. ABAP股票查看代码
  9. 北大青鸟广州天河中心S1T62班HTML项目答辩实录
  10. 第二阶段个人冲刺08
  11. go连接mysql数据库
  12. CMake笔记2 构建动态链接库
  13. ZH奶酪:Python中zip函数的使用方法
  14. java在Intellij上使用sigar
  15. Apollo感知解析之MinBox障碍物边框构建
  16. 四足机器人(从PCB到3D打印)
  17. 联通彻底被iPhone抛弃,失去绯闻女友
  18. edup无线网卡驱动安装linux,EDUP无线网卡驱动下载-EDUP无线网卡驱动排行榜-比克尔下载...
  19. JVM_06 运行时数据区3-方法区
  20. 从我自己的角度总结一下移动互联网的技术

热门文章

  1. vue 富文本存储_Vue富文本编辑器
  2. 要了薪资证明了录取的几率大吗_空乘专业的录取分数线是多少?
  3. 彩色MT9V034摄像头 Bayer转rgb FPGA实现(转载)
  4. python 使用session_使用session和只使用session有什么区别
  5. python 进度条_Python小程序系列——动态进度条(1)
  6. python读书报告_读书笔记 Python编程入门
  7. 【Zookeeper】windows环境下zookeeper安装
  8. IT管理人员需要更加了解数据中心冷却情况
  9. defensive-bash-programming
  10. Ubuntu 14.04环境变量修改