怎么用JavaScript控制CSS的float属性

本篇内容主要讲解“怎么用JavaScript控制CSS的float属性”，感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷，实用性强。下面就让小编来带大家学习“怎么用JavaScript控制CSS的float属性”吧!

创新互联公司专注为客户提供全方位的互联网综合服务，包含不限于网站建设、网站制作、龙安网络推广、成都微信小程序、龙安网络营销、龙安企业策划、龙安品牌公关、搜索引擎seo、人物专访、企业宣传片、企业代运营等，从售前售中售后，我们都将竭诚为您服务，您的肯定，是我们最大的嘉奖；创新互联公司为所有大学生创业者提供龙安建站搭建服务，24小时服务热线：13518219792，官方网址：www.cdcxhl.com

CSS中float属性有很多值得学习的地方，本文和大家重点讨论一下如何使用JavaScript控制CSS的float属性，相信本文介绍一定会让你有所收获。

用JavaScript控制CSS的float属性

今天学习JavaScript控制CSS的float属性时发现的一个兼容性问题，在Aptana没有代码提示，用VisualStudio2008也没有代码提示，不知道是不是因为这个属性在不同的浏览器中不能兼容还是它们都有Bug。先看一下我写的DEMO吧。

ExampleSourceCode

<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN"   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlnshtmlxmlns="http://www.w3.org/1999/xhtml"> <head> <metahttp-equivmetahttp-equiv="Content-Type"content="text/html;charset=utf-8"/> <title>测试了</title>  <scripttypescripttype="text/javascript"> functiondivFloatRight(e){  e.style.backgroundColor="#ff0000";  e.style.styleFloat="right";//IE  e.style.cssFloat="right";//firefoxandothersexplorer  }  functiondivFloatLeft(e){  e.style.backgroundColor="transparent";  e.style.styleFloat="left";  e.style.cssFloat="left";  }  </script>  </head> <body> <div> <dividdivid="demo"style="border:dashed1px#000000;"onmousemove="divFloatRight(this);" onclick="divFloatLeft(this);"> //JavaScript控制div的float属性，onmousemove~float:right,onclick~float:left。  </div> </div> </body> </html>

在这里，IE只能支持obj.style.styleFloat，而Firefox和其它的浏览器只支持obj.style.cssFloat。为了解决这个浏览器兼容问题，一开始小题大作的打算写一个浏览器判断的方法，后来反过来一想，只要把这两个属性设置的语句写在一起就可以兼容各个浏览器了。

到此，相信大家对“怎么用JavaScript控制CSS的float属性”有了更深的了解，不妨来实际操作一番吧！这里是创新互联网站，更多相关内容可以进入相关频道进行查询，关注我们，继续学习！

网站题目：怎么用JavaScript控制CSS的float属性
本文来源：https://www.cdcxhl.com/article32/jcjpsc.html

成都网站建设公司_创新互联，为您提供虚拟主机、响应式网站、外贸网站建设、静态网站、做网站、网站收录

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容