§ ITPOW >> 文档 >> CSS

作者：vkvi 来源：ITPOW（原创） 日期：2010-11-21

常有这么一种登录页面，有个背景图，然后登录框居中，看起来很简单，但要求是不管缩放窗口，背景图和登录框均要求居中，不使用 JavaScript。

body.loginPage { background-image:url("images/login.png"); background-position:50% 50%; background-repeat:no-repeat; background-attachment:fixed; background-color:#000; color:#fff; } .loginPanel { position:absolute; top:50%; left:50%; margin:-150px 0px 0px -200px; width:400px; height:300px; background-color:Transparent; color:#fff; }

很关键的是登录框的 margin，登录框的 margin-left、margin-top 是 width、height 的一半，且为负数。