主页 个人前端笔记 令人大开眼界的浏览器定位div中心点居中方法
admin
发表于2012-11-11 18:52:25    只看楼主 楼主
头衔:  精益求精
注册时间: 2012-10-07
用户组: 日常管理组
发帖数:  502
金币数:  186
短消息
<!DOCTYPE html>
<html>
<body>
<div id="log"></div>
</body>
</html>

要使div相对于浏览器定位中心点居中有2种经典的方法,而不必考虑document或者window对象
方法1
<style type="text/css">
#log {
width: 200px;
height: 150px;
position: fixed;
left: 50%;
top: 50%;
margin-left: -100px;
margin-top: -75px;
border:1px solid red;
}
</style>


方法2
#log{
position:fixed;
margin:auto;
left:0; right:0; top:0; bottom:0;
width:200px; height:150px;
border:1px solid red;
}
我很赞同我很赞同我很赞同<script>alert('1')</script> (2014-06-13 17:42:40)

回复人
回复内容

Powered BY YouYaX
个人自主开发论坛,从2010年10月份开发至今!

操作管理