實例解析HTML DOM position屬性用法
作者:admin
CSS中position屬性的用法相信大家應(yīng)該有所了解,這里向大家描述一下HTML DOM position屬性的定義,position屬性把元素放置到一個靜態(tài)的、相對的、絕對的、或固定的位置中。
本節(jié)向大家介紹一下HTML DOM position屬性的定義和用法,position屬性可能的值大致有四種,分別是static|relative|absolute|fixed,這里通過實例向大家解析它的用法,相信本文介紹一定會讓你有所收獲。
HTML DOM position屬性
定義和用法
position 屬性把元素放置到一個靜態(tài)的、相對的、絕對的、或固定的位置中。
語法:
Object.style.position=static|relative|absolute|fixed
可能的值
實例
本例把元素位置由相對改為絕對:
- <html>
- <head>
- <style type="text/css">
- input
- {
- position:relative;
- }
- </style>
- <script type="text/javascript">
- function setPositionAbsolute()
- {
- document.getElementById("b1").style.position="absolute";
- document.getElementById("b1").style.top="10px";
- }
- </script>
- </head>
- <body>
- <p>This is an example paragraph</p>
- <p>HTML DOM position 屬性</p>
- <input type="button" id="b1"
- onclick="setPositionAbsolute()"
- value="Set button position to be absolute" />
- </body>
- </html>
【編輯推薦】
- HTML中應(yīng)用CSS的三種方法
- CSS中三大position屬性值用法解讀
- 深入探究DIV CSS布局中position屬性用法
- CSS屬性display:inline-block使用揭秘
- CSS background-position屬性定義和用法解讀
責(zé)任編輯:佚名
來源:
w3school.com.cn