asp.net 利用jquery让登录页面垂直居中显示

1377人阅读 评论(0) 收藏 举报
分类:

直接源码,有不懂的请留言。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>权限登录</title>
<link href="css/master.css" type="text/css" rel="stylesheet" />
<script src="js/jquery-1.8.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
       $(function(){
           divresize();
       });
       /**自应高度**/
        function divresize() {
            resizeU();
            $(window).resize(resizeU);
            //这个方法是让无论,浏览者电脑屏幕如何。都能让div居中,垂直居中,div的id是AT
            function resizeU() {
                //css("width")这样获取的是 数字加px,
                var logindiv_width = $("#AT").css("width").replace("px", "");
                //css("height")这样获取的是 数字加px
                var logindiv_height = $("#AT").css("height").replace("px", "");
                $("#AT").css({
                    "margin-left": ($(document).width() - logindiv_width) / 2,
                    "margin-top": ($(document).height() - logindiv_height) / 2,

                });
            }
        }
</script>
</head>

<body class="move">
    <div id="AT">
	<div class="header">
	     <div class="headerLogo"><img src="images/headerLogo.gif" /></div>
	</div>
	<div class="main">
		<div class="login">
			<div class="loginTitle">
				用户权限管理系统
			</div>
			<div class="loginForm">
				<form>
					<div class="prompt">请输入正确的用户名或密码!</div>
					<input type="text" value="请输入用户名" class="loginUser" />
					<input type="text"  value="请输入密码" class="loginPassword"/>
					<div class="rememberPs">
						<input type="checkbox"  class="mr10" />记住密码
					</div>
					<input type="button" class="loginBtn">
				</form>
			
			</div>
		</div>
	</div>
	<div class="footer">技术支持:安徽省XXX有限公司</div>
    </div>
</body>
</html>
 如下图所示:




0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    .NET SL GIS开发群
    欢迎大家加入群,交流分享GIS开发的点点滴滴,共同进步!
    群号1:106887513
    群号2:125514226

    宣传下本人翻译新书《JavaScript构建Web和ArcGIS Server应用实战》,有需要的朋友们支持一下!


          点击下载书籍源码
    程序生活
    博客专栏
    个人资料
    • 访问:1401748次
    • 积分:19893
    • 等级:
    • 排名:第408名
    • 原创:570篇
    • 转载:61篇
    • 译文:3篇
    • 评论:376条
    最新评论