2015-07-28 75 views
1

工作中我有這樣的HTML代碼:CSS樣式不與JSTL標記

<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不工作

+0

那是什麼代碼的實際HTML輸出? – GolezTrol

+0

你可以看到問題..我已經更新了問題 – Salini

+0

對不起,我的意思是由該JSP代碼生成的HTML代碼。它必須與您發佈的第一部分HTML不同,否則您不會得到不同的結果。 – GolezTrol

回答

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>