2017-10-05 33 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> 
相关问题