事業部在畫布

-4

這是我的登錄頁面，我希望把我的登錄框在畫布上現在首秀畫布，然後顯示我想在登錄框格在這個帆布事業部在畫布

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'> <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> <link href="bootstrap/css/font-awesome.min.css" rel="stylesheet" type="text/css" /> <link href="dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" /> </head> <body class="login-page"> <canvas id="header-canvas" style="background-color:#999"> <header id="header" > </header> </canvas> <div class="login-box" > <div class="login-box-body"> <form action="" method="post" name="login"> <div class="form-group has-feedback "> <input type="text" class="form-control" placeholder="Username/Email" required name="login_name"/> <span class="glyphicon glyphicon-envelope form-control-feedback"></span> </div> <div class="form-group has-feedback"> <input type="password" class="form-control" placeholder="Password" name="login_pass"required/> <span class="glyphicon glyphicon-lock form-control-feedback"></span> </div> <div class="row"> <div class="col-xs-4"> <button type="submit" class="btn btn-primary btn-block btn-flat">Sign In</button> </div> </div> </form> </div> </div> <script src="plugins/jQuery/jQuery-2.1.3.min.js"></script> <script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script> <script src="plugins/magnificpopup/plugins.js"></script> </body> </html>

來源

2016-02-09 Eldhose Elias

很難回答沒有jsfiddle，鏈接或一些代碼來看看。 –

請提供代碼它會更容易識別問題 –

這很容易。但是，你應該先提供你的代碼。 – ketan

股利如下方式，你可以放放完了帆布使用position:absolute;

#header-canvas { 
 
    height: 500px; 
 
    width: 100%; 
 
} 
 

 
.login-box { 
 
    background: #fff none repeat scroll 0 0; 
 
    left: 50%; 
 
    padding: 20px; 
 
    position: absolute; 
 
    top: 50%; 
 
    transform: translate(-50%, -50%); 
 
}

<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<canvas id="header-canvas" style="background-color:#999"> <header id="header" > </header> </canvas> 
 

 
<div class="login-box" > <div class="login-box-body"> 
 
<form action="" method="post" name="login"> 
 
    <div class="form-group has-feedback "> 
 
    <input type="text" class="form-control" placeholder="Username/Email" required name="login_name"/> 
 
    <span class="glyphicon glyphicon-envelope form-control-feedback"></span> 
 
</div> 
 
    <div class="form-group has-feedback"> 
 
    <input type="password" class="form-control" placeholder="Password" name="login_pass"required/> 
 
    <span class="glyphicon glyphicon-lock form-control-feedback"></span> 
 
    </div> 
 
    <div class="row"> <div class="col-xs-4"> 
 
    <button type="submit" class="btn btn-primary btn-block btn-flat">Sign In</button> </div> 
 
</div> 
 
</form> 
 
</div> 
 
</div>

Working Fiddle

來源

2016-02-09 08:11:26 ketan

回答

相關問題