将一个对象定位到页面的右下角

最新推荐文章于 2022-11-23 17:28:33 发布

勿视人非

最新推荐文章于 2022-11-23 17:28:33 发布

阅读量2.2k

点赞数

分类专栏： javascript

本文链接：https://blog.csdn.net/u011939453/article/details/53301320

版权

javascript 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

<html>
<head>
<style type="text/css">
.position{
  text-align:right;
  position:absolute;
  right: 0%;
  bottom: 0%;
  margin-bottom:5px;
  margin-right:5px;
}
</style>
 <script type="text/javascript"> 
  function myclock(){
   var myclock=new Date();
   document.getElementById("showtime").innerHTML = myclock.toLocaleString();
   }
 function showclock(){
   	window.setInterval(myclock,1000);
   }
</script>
  </head>
  <center><body οnlοad="showclock()">
      <div id="showtime" class="position"></div>
  </body>

</html>

上面的代码，可以将DIV定位到页面的右下角，通过修改right，bottom，left，top等参数，可以将DIV定位到页面的任何一个角上。

而且会随着页面大小的变化而变化。不会出现页面变小而不显示DIV的情况。

就算将这个页面嵌套到另外一个页面，只要设置得当，DIV还是显示在界面的右下角。

如下图：