逛到发现这个 个人感觉非常赞

下面是CSS样式

Js代码                          

  1. input {
  2. border:1px solid #B3D6EF; 
  3. background:#ffffff;
  4. }
  5. input {
  6. star : expression(
  7. onmouseover=function(){this.style.backgroundColor="#D5E9F6"},
  8. onmouseout=function(){this.style.backgroundColor="#ffffff"})
  9. }

好处在于 不用在页面中写一堆一堆的onMouseover函数了

lolo 
有些问题需要注意下,这种写法有可能在IE6下造成浏览器卡死,目前做的一个旧出现了卡死现象...

2009年11月24日1:31:36 
这里引用下怪飞的一篇CSS优化的文章

引用

浏览器中 CSS Expression 特性的最大的问题:会反复执行,每秒钟可能执行了成百上千次,有严重的性能问题。 
如何对 CSS Expression 进行优化呢? 
至少:如果我们将 CSS Expression 在匹配的元素中仅执行一次,性能将会提升很大。 
old9 在 《CSS Expression Reloaded》一文中提供了一个解决方案:

引用

在 CSS Expression 语句体里,将触发该 Expression 的 CSS 属性重置。

Js代码  

  1. div {
  2. zoom: expression(function(el){el.style.zoom = "1"; alert(el.tagName);}(this));
  3. }

或者

Js代码  

  1. div {
  2. -singlex: expression(this.singlex ? 0 : (function(t) { alert(t.tagName); t.singlex = 0; } )(this));
  3. }

说明一下~: 
CSS Expression 执行在任意一个匹配的元素上。 
在 CSS expression 内, “this”关键字指向当前匹配的 HTML 元素。 
CSS 属性选用一些不常用的属性来触发,触发完重置回默认值。

这里是原文 
http://www.planabc.net/2009/09/21/optimization_of_css_eexpression/

引用

关于Expression,雅虎团队提到这些

18、避免使用CSS表达式(Expression  
      CSS表达式是动态设置CSS属性的强大(但危险)方法。Internet Explorer从第5个版本开始支持CSS表达式。下面的例子中,使用CSS表达式可以实现隔一个小时切换一次背景颜色: 
      background-color: expression( (new Date()).getHours()%2 ? "#B8D4FF" : "#F08A00" );  
如上所示,expression中使用了JavaScript表达式。CSS属性根据JavaScript表达式的计算结果来设置。expression方法在其它浏览器中不起作用,因此在跨浏览器的设计中单独针对Internet Explorer设置时会比较有用。 
      表达式的问题就在于它的计算频率要比我们想象的多。不仅仅是在页面显示和缩放时,就是在页面滚动、乃至移动鼠标时都会要重新计算一次。给CSS表达式增加一个计数器可以跟踪表达式的计算频率。在页面中随便移动鼠标都可以轻松达到10000次以上的计算量。 
      一个减少CSS表达式计算次数的方法就是使用一次性的表达式,它在第一次运行时将结果赋给指定的样式属性,并用这个属性来代替CSS表达式。如果样式属性必须在页面周期内动态地改变,使用事件句柄来代替CSS表达式是一个可行办法。如果必须使用CSS表达式,一定要记住它们要计算成千上万次并且可能会对你页面的性能产生影响。

css控制input标签的更多相关文章

  1. 控制input标签中只能输入数字以及小数点后两位

    js 代码如下: /* 控制input标签中只能输入数字 和小数点后两位 */ function checkNum(obj) { //检查是否是非数字值 if (isNaN(obj.value)) { ...

  2. CSS控制a标签链接的四种状态

    /*CSS链接的四种状态 *a:link 普通的.未被访问的链接样式 *a:visited 用户已访问的链接样式 *a:hover 鼠标指针位于链接上方样式 *a:active 链接被点击的时刻样式 ...

  3. 全局css控制<td>标签属性

    td { text-align: center; /*设置水平居中*/ vertical-align: middle; /*设置垂直居中*/    height:50px;             / ...

  4. css控制ul标签下的指定li标签样式

    ul li:first-child{ }  第一个ul li:last-child{ }   最后一个ul li:nth-child(4){ } 指定第几个,4就是代表第四个ul li:nth-chi ...

  5. 控制input输入框光标的位置

    一:理解input, textarea元素在标准浏览器下两个属性selectionStart, selectionEnd. selectionStart: 该属性的含义是 选区开始的位置: selec ...

  6. css中的img和input标签

    一般情况下,行内元素设置宽高是无效的,常见的有a标签.img和input也属于行内元素,但他们却可以设置宽高!!!! 查阅了一些资料才明白,原来css的元素还有另外一种分类方法,可替换元素,不可替换元 ...

  7. input标签写CSS时需要注意的几点(先收藏)

    (从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期2014-05-05) 飞鱼的声纳顶部的搜索框让我头疼了很长时间,原因是总不能获得跨浏览器的统一样式.主要的问题有这么两个:一是inpu ...

  8. 使用css全面美化input标签

    做网站时经常有这样那样的需要,要美化input ,于是CSS的美化必不可少.和程序人生的站长交流,他发给我这个. 下面是CSS样式 input { border:1px solid #B3D6EF; ...

  9. CSS控制XML与通过js解析xml然后通过html显示xml中的数据

    使用CSS控制XML的显示 book.css bookname{ display:block;color:Red} author{ display:block;font-style:italic} p ...

随机推荐

  1. android 横竖屏 切换

    韩梦飞沙  韩亚飞  313134555@qq.com  yue31313  han_meng_fei_sha 横竖屏切换 会重新凋用 activity的 生命周期,再次oncreat() 如果清单文 ...

  2. .Net Discovery 系列之七--深入理解.Net垃圾收集机制(拾贝篇)

    关于.Net垃圾收集器(Garbage Collection),Aicken已经在“.Net Discovery 系列”文章中有2篇的涉及,这一篇文章是对上2篇文章的补充,关于“.Net Discov ...

  3. Noip2005谁拿了最多的奖学金题解

    题解 题目本身没什么好说的. 只是一道普及组的题让我领悟到scanf()读字符的真谛.scanf()函数最奇异的功能就是控制串里除格式化字符串之外的字符.若匹配成功则舍去. 所以我们能够"精 ...

  4. 对一个前端使用AngularJS后端使用ASP.NET Web API项目的理解(3)

    chsakell分享了一个前端使用AngularJS,后端使用ASP.NET Web API的项目. 源码: https://github.com/chsakell/spa-webapi-angula ...

  5. FreeCommander 学习手册

    概述 转载请注明出处:http://www.cnblogs.com/skywang12345/p/3470728.html FreeCommander(下文简称FC),是Windows下面比较强大的文 ...

  6. iOS越狱知多少?

    著名iOS黑客团队Evad3rs上周上线了evasi0n 官网,用于展示他们破解iOS 6 和iOS 6.1  系统的进度.据官网显示,其越狱工具evasi0n已正式上线,支持iPhone.iPad等 ...

  7. 安装oracle 11g环境变量ORACLE_HOME的一个问题 转

    http://blog.itpub.net/26129555/viewspace-1243467/报错内容: OUI-10137:An Oracle Home with name ORACLE_HOM ...

  8. android&php 加密解密

    from://http://blog.csdn.net/hecker385/article/details/6717647 android&php 加密解密 分类: Php Android20 ...

  9. ADO与ADO.Net

    在介绍ADO.Net之前先让我们回想一下在红皮书中学习的ADO的内容. ADO(ActiveX Data Objects).我们称它为一种用于数据訪问的对象模型,<VB.Net>视频中称它 ...

  10. PHPthinking赠书了!

    [站长赠书]2014年10月第一期幸运用户  大家好,我是PHP开发学习门户的站长,小站建站一个多月,感谢大家以来的关注和支持,假设大家对本站有什么建议或者投稿,欢迎留言或者给我发邮件. 本站宣布对于 ...