Question

在下面的代码中我放置了控制器。实际结果是ligin处于中心位置但它在底部。我的预期结果是登录应该在页面的中心。请帮助我这样做。控制器：

<html>
<head>

 </head>
<title>login_form</title>
<BODY onLoad="noBack();" onpageshow="if (event.persisted) noBack();" onUnload=""><div class="container">

            <div class="row">
                <div class="span4 logo">
                   <img src="<?php echo base_url('img/logosl.png'); ?>"  style="margin-bottom:7px; margin-top:7px;"/>
             </div>

<center ><div id="login_form" >

    <h1>Login!</h1>



    <form action="<?php echo base_url(); ?>index.php/login/validate_credentials" method="post" >
    <input type="text"  name="username" required placeholder="username"  style="height: 25px;" value=""  />
    <input type="text"  name="password" required placeholder="password"  style="height: 25px;" value=""  />
    <input type="text"  name="college_name" required placeholder="college_name"  style="height: 25px;" value=""  />
    <input type="submit" name="submit" value="Login"  class="btn-success btn" />

    <a href="login/signup">Create Account</a>
    </form>


</div></center><!-- end login_form-->


<?php $this->load->view('includes/header'); ?>
<link rel="stylesheet" type="text/css" href="<?php echo base_url();?>css/style1.css"  />




<?php $this->load->view('includes/footer'); ?>
</body>
</html>

CSS

body {
    background:#FFFFFF;
    margin: 0;
    padding: 0;
    font-family: arial;
}
#login_form {
    width: 300px;
    background: #f0f0f0 url(../img/login_bg.jpg) repeat-x 0 0;
    border: 1px solid white;
    margin: 250px auto 0;
    padding: 1em;
    -moz-border-radius: 3px;
}
h1,h2,h3,h4,h5 {
    margin-top: 0;
    font-family: arial black, arial;
    text-align: center;
}

input[type=text], input[type=password] {
    display: block;
    margin: 0 0 1em 0;
    width: 280px;
    border: 5px;
    -moz-border-radius: 1px;
    -webkit-border-radius: 1px;
    padding: 1em;
}

input[type=submit], form a {
    border: none;
    margin-right: 1em;
    padding: 6px;
    text-decoration: none;
    font-size: 12px;
    -moz-border-radius: 4px;
    background: #348075;
    color: white;
    box-shadow: 0 1px 0 white;
    -moz-box-shadow: 0 1px 0 white;
    -webkit-box-shadow: 0 1px 0 white;

}

input[type=submit]:hover, form a:hover {
    background: #287368;
    cursor: pointer;
}




/* Validation error messages */

.error {
    color: #393939;
    font-size: 15px;
}

fieldset {
    width: 300px;
    margin: auto;
    margin-bottom: 2em;
    display: block;
}

/* FOR FUN */

h1 {
    text-shadow: 0 1px 0 white;
}

/* Not necessary. Just the "tutorial created by" stuff at the bottom */

#tutInfo {
    background: #e3e3e3;
    border-top: 1px solid white;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: .7em .7em .7em 2em;
}

Answer 1

你缺少＆lt; / div＆gt;

 <div class="row">
        <div class="span4 logo">
               <img src="<?php echo base_url('img/logosl.png'); ?>"  style="margin-bottom:7px; margin-top:7px;"/>
         </div>
**</div>**

登录应位于页面的中心

1 个答案: