CSS中expression属性如何使用,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。
CSS expression属性作用
1、给元素固有属性赋值
下面的实例是依照浏览器的大小来安置一个元素的位置。查看运行效果试试。
SourceCodetoRun
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <htmlxmlnshtmlxmlns="http://www.w3.org/1999/xhtml"> <head> <metahttp-equivmetahttp-equiv="Content-Type"content="text/html;charset=utf-8"/> <title>www.52css.com</title> <styletypestyletype="text/css"> <!-- #myDiv{ position:absolute; width:100px; height:100px; background:#c00; left:expression(document.body.offsetWidth-180+"px"); top:expression(document.body.offsetHeight--80+"px"); text-align:center; line-height:90px; color:#fff; } --> </style> </head> <body> <dividdivid="myDiv">52css.com</div> </body> </html>
[可先修改部分代码再运行查看效果]
2、给元素自定义属性赋值
我们想给页面的链接消除点击时产生的虚线。
在一般情况下,我们是这样做的:
ExampleSourceCode
<ahrefahref="link1.htm"onfocus="this.blur()">52css.com</a><br/> <ahrefahref="link2.htm"onfocus="this.blur()">52css.com</a><br/> <ahrefahref="link3.htm"onfocus="this.blur()">52css.com</a>
粗看或许没有感觉。但如果你的页面上有几十甚至上百个链接,这时的你难道还会机械式地Ctrl+C,Ctrl+V么,采用expression的优势现在就突现出来了。两者比较,哪个产生的冗余代码更多呢?
◆采用expression的做法如下:
a{star:expression(thisthis.onFocus=this.blur())}
我们看下面的例子:
SourceCodetoRun
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <htmlxmlnshtmlxmlns="http://www.w3.org/1999/xhtml"> <head> <metahttp-equivmetahttp-equiv="Content-Type"content="text/html;charset=utf-8"/> <title>www.52css.com</title> <styletypestyletype="text/css"> <!-- a{star:expression(this.onFocus=this.blur())} --> </style> </head> <body> <ahrefahref="#">我爱CSS-www.52css.com</a> </p> </body> </html>
关于CSS中expression属性如何使用问题的解答就分享到这里了,希望以上内容可以对大家有一定的帮助,如果你还有很多疑惑没有解开,可以关注编程网行业资讯频道了解更多相关知识。