css样式不适用于jstl标记

时间:2015-07-28 11:48:19

标签: html css jsp

我有这个HTML代码:

<div class="login-card">
<h1>Log-in</h1><br>
    <form>
        <table>
            <tr>
                <td>* EMAIL ID</td>
                <td><input type="text" name="Email_Id" maxlength="100" /></td>
                </tr>
            <tr>
                <td>* Password</td>
                <!-- <td> <input type="password" name="pass" placeholder="Set your Password"></td> -->
                <td> <input type="password" name="pass" ></td>

            </tr>
            <tr>
                <td></td>
                <td>  <input type="button" name="create" class="login login-submit" value="login" onclick="showDiv()"></td>
            </tr>
        </table>          
    </form>
</div>

它有css来设置表单的样式:

.login-card table {
    font-family: Calibri;
    font-size: 11pt;
    font-style: normal;
    text-align:center;
    margin-left:auto;
    margin-right:auto;
}
tr {
    text-align: center;
}
.login-card h1 {
    font-weight: 170;
    text-align: center;
    font-size: 5em;
}
.login-card input[type=submit] {
    width: 100%;
    display: block;
    margin-bottom: 10px;
    position: relative;
}
.login-card input[type=text], input[type=password] {
    height: 44px;
    font-size: 16px;
    width: 100%;
    margin-bottom: 10px;
    -webkit-appearance: none;
    background: #fff;
    border: 1px solid #d9d9d9;
    border-top: 1px solid #c0c0c0;
    /* border-radius: 2px; */
    padding: 0 8px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}

以上带有css的html代码工作正常,但我必须使用下面的html代码:

<%@taglib uri="http://www.springframework.org/tags/form" prefix="form" %>
    <div class="login-card">
        <form:form method="post" action="addContact.html">
            <table>
                <tr>
                    <td>
                        <form:label path="email">Email</form:label>
                    </td>
                    <td>
                        <form:input path="email" />
                    </td>
                </tr>
                <tr>
                    <td>
                        <form:label path="password">password</form:label>
                    </td>
                    <td>
                        <form:input path="password" />
                    </td>
                </tr>
                <tr>
                    <td colspan="2">
                        <input type="submit" value="Add Contact" />
                    </td>
                </tr>
            </table>
        </form:form>
    </div>

现在,当我运行这个时,css无效

1 个答案:

答案 0 :(得分:0)

@Salini你可以在你的html中使用以下代码与固定标签和输入字段,但你必须记住action="将不能基于html工作,因为你需要像Php这样的服务器端语言处理表格。

<div class="login-card">
   <form method="post" action="addContact.php">

    <table>

        <tr>
        <td><label for="textfield">email</label></td>
        <td> <input type="text" name="email"/></td>
    </tr>
    <tr>
        <td><form:label path="password">password</form:label></td>
        <td> <input type="password" name="password"/></td>
    </tr>
    <tr>
        <td colspan="2">
            <input type="submit" value="Add Contact"/>
        </td>
    </tr>
</table>    

</form>