CSS中expression属性如何使用

发布时间:2021-06-23 14:59:24 作者:Leah
来源:亿速云 阅读:201

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属性如何使用问题的解答就分享到这里了,希望以上内容可以对大家有一定的帮助,如果你还有很多疑惑没有解开,可以关注亿速云行业资讯频道了解更多相关知识。

推荐阅读:
  1. css中动画属性如何使用
  2. 优化css expression性能的方法

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

css expression

上一篇:CSS中如何使用float浮动属性

下一篇:常用的数据分析方法论有哪些

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》