CSS 设置网页背景颜色无法正常显示求解!
问题:我在css中设置想让header区块的背景色为#0000FF也就是深蓝色,在Myeclipse的预览中正常显示(图1),但是在搜狗浏览器显示中header并没有着色...
问题:我在css中设置想让header区块的背景色为#0000FF也就是深蓝色,在Myeclipse的预览中正常显示(图1),但是在搜狗浏览器显示中header并没有着色(图2),在MicrosoftEdge浏览器或者IE11中则可以显示我在之前设置过的一个颜色,但是我将header改为深蓝后重启本地服务器刷新页面后页面显示还是原来的样式且footer模块也被设置成该背景色了!!!(图3/4)求解啊!!!以下为页面代码,Jsp的部分请无视,重点是css啊啊啊啊!!!<%@ page language="java" import="java.util.*" %><%@ page contentType="text/html;charset=gb2312" %><%@ page import="java.util.Date,java.text.*"%><% Date nowday=new Date();int hour=nowday.getHours();SimpleDateFormat format=new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");String time=format.format(nowday);%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <style type="text/css">/*以下为主体框架*/ *{ padding:0; margin:0;}a{text-decoration:none;}body{ padding-top:20px;}.header,.footer{ width:100%;height:20px margin:0 auto; border:1px solid #000; text-align:center; clear:both}.b{ width:100%; margin:0 auto;}.footer{ border-top:none;}.a1{ width:1920px; height:612px; border:1px solid #000; border-top:none; }.b2,.b3,.b4{ float:left; width:439px; height:600px; border-right:1px solid #000; border-bottom:1px solid #000;}.b1{ float:left; width:599px; height:856px; border-left:1px solid #000;border-right:1px solid #000; border-bottom:1px solid #000;}/*以下为导航栏所用*/ ul#nav{ width:100%; height:60px; background:#3b425b;margin:0 auto ;opacity:0.7 ; } ul#nav li{display:inline; height:60px} ul#nav li a{display:inline-block; padding:0 20px; height:60px; line-height:60px; color:#FFF; font-family:"\5FAE\8F6F\96C5\9ED1"; font-size:16px} ul#nav li a:hover{background:#4b5167}</style> <title>My JSP 'index.jsp' starting page</title> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> </head><body> <div class="header" style="background-color:#0000FF;">现在时间是<%=time%></div> <div class="a1"> <ul id="nav"> <li><a href="xxxxxx">游戏特色</a></li> <li><a href="xxxxxxx">英雄介绍</a></li> <li><a href="xxxxxx">视频图片</a></li> <li><a href="xxxxxx">新闻</a></li> <li><a href="xxxxxx">下载</a></li> <li><a href="xxxxxx">用户登录</a></li> <li><jsp:include page="myfront.jsp" /></li> </ul><img src="image/a1.jpg" style="width:1920px;height:612px"/> <div> </div> </div> <div class="b"> <div class="b1"><jsp:include page="vote.jsp"></jsp:include></div> <div class="b2">B2</div> <div class="b3">B3</div> <div class="b4">B4</div> <div></div></div><div class="footer">This page is for Web demostration purpose only</div> </body></html>
展开
4个回答
展开全部
.header,.footer{ width:100%;height:20px 这里少了一个分号margin:0 auto; border:1px solid #000; text-align:center; clear:both}
.header,.footer{ width:100%;height:20px ;margin:0 auto; border:1px solid #000; text-align:center; clear:both}
.header,.footer{ width:100%;height:20px ;margin:0 auto; border:1px solid #000; text-align:center; clear:both}
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
首先,你的代码布局肯定是有问题的,除了第一张图后面的导航栏位置全都有问题。
第二:搜狗浏览器我没有,但是不应该出现这样的情况
第三:由于html上style设置的颜色是高于css代码里的,所以你说的显示之前的颜色应该就是这个问题,至于你说的footer也出现了背景色,应该是你代码自己的问题,我看到你把header和footer的选择器是写在一起的。
第二:搜狗浏览器我没有,但是不应该出现这样的情况
第三:由于html上style设置的颜色是高于css代码里的,所以你说的显示之前的颜色应该就是这个问题,至于你说的footer也出现了背景色,应该是你代码自己的问题,我看到你把header和footer的选择器是写在一起的。
追问
可是我在header和footer共用的属性里并没有定义背景颜色啊...footer的问题应该是TOMCAT的缓存还在,但我在css里面给header设定的样式颜色就是我想要的颜色啊!但是没显示出来...
追答
没显示出来是因为你在html里的header写了style,style优先级是要比css高的,所以你写的css没用。没定义背景色就是别的什么问题,你的代码应该是没有问题的。
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
你到底是想要实现哪种效果的?图一的效果?
追问
对,图一是ME的预览图,没有问题,但是不知为啥部署的TOMCAT上用浏览器看就变奇怪了囧
追答
你应该在本地调试好了再上传到服务的啊?缓存的原因占多数
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询