ZhihanXing 发表于 2023-11-8 10:08:30

java web网页的样式设定问题

在Java web开发过程中,网页从数据库读取了信息并展示在网页的表格中。但是表格背景颜色是白色且无法更换,这是什么原因?
网页的代码
<%@ page import="edu.zjku.service.BlogService" %>
<%@ page import="edu.zjku.service.BlogServiceImpl" %>
<%@ page import="java.util.List" %>
<%@ page import="edu.zjku.bean.Blog" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>我的博客主页</title>
    <link rel="stylesheet" href="style/public.css">
    <link rel="stylesheet" href="style/index.css">
    <script src="script/ad.js" async></script>
</head>
<body>
<jsp:include page="header.jsp"/>
<jsp:include page="ad.jsp"/>
<div class="box">
    <%BlogService service = new BlogServiceImpl();%>
    <%List<Blog> blogs =service.selectPass();%>
    <%for(Blog blog:blogs){%>
    <table>
      <tr><td class="title"><%=blog.getTitle()%></td></tr>
      <tr><td class="text"><%=blog.getText()%></td></tr>
      <tr><td class="user"><%=blog.getUser()%></td></tr>
      <tr><td class="time"><%=blog.getTime()%></td></tr>
    </table>
    <%}%>
</div>
<jsp:include page="footer.jsp"/>
</body>
</html>

对应的CSS样式表
.box table {
    width: 600px;
    padding: 0 75px;
    background-color: #3498db;
}

.box table .title,
.box table .text,
.box table .user,
.box table .time {
    display: block;
    width: 600px;
}

.box table .title {
    text-align: center;
    font-size: 20px;
    font-weight: 600;
}

.box table .text {
    font-size: 14pt;
    white-space: pre-wrap;
}

.box table .user,
.box table .time {
    text-align: right;
}

isdkz 发表于 2023-11-8 10:08:31

在代码中,表格的背景颜色被设置为蓝色(#3498db),而不是白色。所以问题不是表格背景颜色无法更换的原因。

可能的原因是CSS样式表中的选择器与HTML代码中的表格元素不匹配。根据给出的代码,应该将选择器修改为:

.box table tr td {
    background-color: #ffffff; // 白色
}

这样就可以将表格单元格的背景颜色设置为白色了。

Mike_python小 发表于 2023-11-8 10:09:04

网页表格背景颜色问题

这个问题很可能是由于CSS样式表中的设置覆盖了你尝试应用于表格背景颜色的样式。在你提供的代码中,你已经为表格设置了背景颜色:

ss
.box table {
    width: 600px;
    padding: 0 75px;
    background-color: #3498db;
}


这段样式表指定了表格的背景颜色为 #3498db,但是实际上可能被其他样式所覆盖。

要解决这个问题,你可以使用浏览器的开发者工具来检查元素的样式,并查看是否有其他样式覆盖了你想要的背景颜色。你可以通过以下步骤来操作:

1. 在网页上右键单击表格部分,并选择"检查"(Inspect)或者"审查元素"(Inspect Element)。
2. 在开发者工具中找到该表格元素,然后查看应用在这个元素上的所有样式。

另外,你还可以尝试使用更具体的CSS选择器来覆盖其他样式,例如:

ss
.box table {
    width: 600px;
    padding: 0 75px;
    background-color: #3498db !important; /* 使用 !important 来强制覆盖其他样式 */
}


添加 !important 可以确保这个样式优先级最高,从而覆盖其他可能存在的样式。

希望这些建议能够帮助你解决表格背景颜色无法更换的问题。如果还有其他问题,请随时向我提问。

球一个最佳答案谢谢啦!这对我非常重要!{:10_254:}{:10_254:}{:10_254:}
页: [1]
查看完整版本: java web网页的样式设定问题