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

原创 2015年07月07日 18:52:49

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

<!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>
 如下图所示:




版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

关于 c# 中SQL 事务的回滚

用事务的方式执行 无返回的sql 语句或存储过程,使用了 cmd.ExecuteNonQuery(); 后如果没有提交事务,该方法执行并未成功,并且此时该方法涉及的表,其他事务都无法操作。必须将该事务...

asp.net开发中利用jquery来实现滚动下拉标题浮动固定显示

1、问题来源       在实际项目开发中,页面如果内容很多,会出现滚动条,方便向下浏览,但是页面的标题头也会随下拉操作而无法看到,那如果我们想让下拉过程中标题仍在页面最顶端固定浮动显示,我们该如何做...

asp.net mvc 中利用jquery datatables 实现数据分页显示

1、Controller中的方法代码如下:由于方法中的存储过程没有带分页参数,所以还可以有继续优化的空间。 /// /// 获取测点列表 /// ...

jquery 弹出层垂直居中不动 页面可滚动兼容ie6

弹出层 $(function(){ $('.popBox em').click(function(){ $('.popBox').fadeOut(function(){ $('#screen...
  • boyit0
  • boyit0
  • 2015年01月27日 15:28
  • 836

asp.net连接access数据库的登录页面

1.创建access数据库 login.mdb  新建表user  2.  login.aspx 页面 代码:     欢迎登陆                               ...

用ASP.NET实现简单的超市管理系统-登录页面

一、  任务描述 1.     使用Asp.NET技术,完成超市商品管理系统 2.     开发工具:VS2010 3.     数据库:SQL Server 2008 4.     功能模块...

ASP.Net课堂--实验1(登录注册页面实现)

ASP.Net课堂--实验1(登录注册页面实现) 如何利用Visual  studio 2010创建一个ASP网站? 【文件】-->【新建】-->【网站】-...
  • wwj_748
  • wwj_748
  • 2013年04月14日 14:02
  • 12039

ASP.NET 个人信息注册页面,并跳转显示

题目 新建一个MVC项目,利用HTML、CSS、JS、jQuery、Ajax、jQuery UI等技术设计一个个人信息注册页面。当点击“提交”按钮时,跳转到新的页面显示录入信息。 基本要求: 用...

ASP.NET----利用隐藏域向页面间数据传递

摘要: 隐藏域不会显示在用户的浏览器中, 一般是在页面中加入一个隐藏控件, 与服务器进行交互时把值赋给隐藏控件并提交给下一页面。隐藏域可以是任何存储在网页中的与网页有关的信息的存储库。 使用: ...
  • zhanzkw
  • zhanzkw
  • 2011年11月01日 15:52
  • 1329

Asp.net 权限控制 利用用户控件include到页面

为了使用户能够根据需要方便地定义控件,ASP.NET引入了 Web 窗体用户控件的概念。实际上,只要将.aspx稍作修改即可转换为 Web 用户控件,扩展名为 .ascx,.ascx和.aspx文件一...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:asp.net 利用jquery让登录页面垂直居中显示
举报原因:
原因补充:

(最多只允许输入30个字)