2017-10-05 34 views
1

我已經創建了一個關於學生數據庫的struts2應用程序。 問題在於,無論何時在表中顯示數據庫之後添加提交按鈕,該按鈕都被與之前表格的行寬相似的大背景包圍。我想刪除該邊框。表後的按鈕自動添加爲一行。如何分離他們?

這裏是如何看起來像: enter image description here

看,怎麼也繞置按鈕灰色的背景,我不希望出現這種情況。

下面是代碼片段: JSP:

<table> 
      <tr> 
      <th>RollNo:</th> 
      <th>Name:</th> 
      <th>DOB:</th> 
      <th>Gender:</th> 
      <th>Address:</th> 
      </tr> 
      <% 
      while(rs.next()) 
      { 

      %> 
        <tr> 
        <td><%=rs.getInt(1) %></td> 
        <td><%=rs.getString(2) %></td> 
        <td><%=rs.getString(3) %></td> 
        <td><%=rs.getString(4) %></td> 
        <td><%=rs.getString(5) %></td> 
        </tr> 
        <% 

       } 
       %> 
     </table> 
     <% 
     rs.close(); 
     stmt.close(); 
     conn.close(); 
    } 
    catch(Exception e) 
    { 
     e.printStackTrace(); 
    } 


    %> 
    </div> 
    <br><br> 

    <s:form action="home.jsp"> 
     <s:submit class="button4" value="Home"></s:submit> 
    </s:form> 

table.css文件:

table { 
    background-color: #dbdbdb; 
    width: 60%; 
} 

th,td { 
    color: #363b3f; 
    border-bottom: 1px solid #ddd; 
} 

tr:nth-child(even) { 
    background-color: #c8c8c8 
} 

tr:hover { 
    background-color: #c488d7; 
} 

button.css

.button4 
{ 
    background-color: #af4ccf; /* purple */ 
    border: none; 
    color: black; 
    padding: 18px; 
    font-family: 'Amputa'; 
    text-align: center; 
    text-decoration: none; 
    display: inline-block; 
    font-size: 14px; 
    margin: 4px 2px; 
    border-radius: 30%; 
    -webkit-transition-duration: 0.4s; /*Safari*/ 
    transition-duration: 0.4s; 
    cursor: pointer; 
} 

.button4:hover 
{ 
    background-color: #c986df; /* Light purple */ 
} 

我試圖封裝表並在單獨的div中按鈕。 另外我試過了,把按鈕放在不同的表格中。但沒有任何工作。 我似乎無法確定可能出錯的確切位置。 如何以及如何讓背景邊框消失並居中對齊按鈕?

+0

不夠代碼...顯示我們所有的HTML/CSS ... –

+1

瞭解如何在瀏覽器中使用的開發工具。 –

回答

1

s:form生成由標記實現使用的freemarker模板分析的附加HTML元素。它根據標籤使用的主題選擇一個模板。

您已經爲頁面上的任何元素(包括由Struts標記生成的元素)創建了CSS,因此樣式被繼承。

對所有頁面元素使用公共選擇器並不總是適合頁面上元素的設計和外觀。另一方面,合格選擇器將其用途限制爲可以用容器或其他元素包裝的特定內容。您還可以使用id或在表上使用class屬性來限定選擇器,並按類限定選擇器。

Struts使用UI標籤生成的元素的一些主題。如果你想用Struts標籤自定義設計頁面,那麼你的 應該使用simple主題。

<s:form action="home.jsp" theme="simple" cssStyle="background-color: none"> 
    <s:submit class="button4" value="Home"></s:submit> 
</s:form> 
相關問題