Question

我正在编写一些隐藏的代码，并根据用户是想登录还是注册来显示不同的表单。但由于某种原因，我的表单不会显示在<form class="login-inputs">之间的html中，它甚至不会出现在HTML文档中。谁能明白为什么？

<div class="col-md-3">

    <button type="button" id="login" class="btn btn-default login hidden">Login</button>
    <button type="button" id="register" class="btn btn-default register">Register</button>
    <form class="login-inputs hidden">
        <h3>Login</h3>
        <div class="form-group">
            <label for="inputEmail">Email</label>
                <input type="email" class="form-control" id="inputEmail" placeholder="Email">
        </div>
        <div class="form-group">
            <label for="inputPassword">Password</label>
                <input type="password" class="form-control" id="inputPassword" placeholder="Password">
        </div>
            <div class="checkbox">
                <label><input type="checkbox"> Remember me</label>
            </div>
        <button type="submit" class="btn btn-primary">Login</button>
    </form>
</div>

Answer 1

删除隐藏的课程。

媒体屏幕元素＆＃34; on＆＃34;和＆＃34;关＆＃34;类：

/* For Phone device */
.visible-xs{
   display: block !important;
}
.hidden-xs{
   display: none !important;
}
/* For Phone device End */

@media (min-width: 768px){
   .visible-sm{
       display: block !important;
}
  .hidden-sm{
       display: none !important;
}

}
@media (min-width: 992px){
   .visible-md{
      display: block !important;
}
   .hidden-md{
      display: none !important;
}

}
@media (min-width: 1200px){
    .visible-lg{
       display: block !important;
}
    .hidden-lg{
       display: none !important;
}
}

只需使用该课程。这个CSS已经有了bootstrap 3。

表单没有包装在正确的类中

1 个答案: