JSP引用CSS有关问题
日期：2014-05-17 浏览次数：20686 次
JSP引用CSS问题
我在JSP中引用外部CSS文件，JSP文件如代码所示:
navigator.jsp代码如下（因代码过多，有部分省略，但不影响网页的运行）：
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css" href="CssStyle/main.css" />
<script src="JsScript/main.js" type="text/javascript"></script>
<title>计算机组成原理精品课程</title>
</head>
<body>
<div id="navigate">
<ul>
<li>首页</li>
<li>课程介绍</li>
<li onmousemove="switchMenu('teach')">教学资源</li>
<li>教学大纲</li>
<li onmousemove="switchMenu('activity')">实践教学</li>
<li>教学队伍</li>
<li网络课堂</li>
<li>论坛</li>
</ul>
</div>
<div id="teach" style="display:none;">
<ul>
<li>课件</li>
<li>教案</li>
<li>教学录像</li>
<li>教学条件</li>
<li>方针政策</li>
</ul>
</div>
<div id="activity" style="display:none;">
<ul>
<li>实践思路</li>
<li>基础性实验</li>
<li>设计性实验</li>
<li>实践效果</li>
<li>科技创新</li>
</ul>
</div>
</body>
</html>
main.css代码如下：
@CHARSET "UTF-8";
<!--设置主导航栏的样式-->
#navigate{
margin:0 auto;
width:1024px;
height:150px;
display:block;
background-color:#ffdd00;
border:2px solid;
}
#navigate ul {
line-height:30px;
clear:both;
}
#navigate ul li{
margin-right:15px;
list-style:none;
float:left;
}
<!--设置其他导航栏的样式-->
#activity,#teachMethod,#teach,#compus,#webClass{
margin:0 auto;
display:block;
}
#activity ul,#teachMethod ul,#teach ul,#compus ul,#webClass ul{
clear:both;
}
#activity ul li,#teachMethod ul li,#teach ul li,#compus ul li,#webClass ul li{
margin-right:30px;
list-style:none;
float:left;
}
仔细看过，CSS文件应该没什么问题，以前在HTML文件中是这样引用，但这次在JSP当中引用时，出现了一些问题：
就是当我引入CSS文件时，所有在当前JSP页面中定义的background-color等与背景有光的属性均没有效果，而且在CSS当中定义这些属性也没有用；
而当我把CSS引入的语句注释了之后，在页面当中的定义重新有效。另外还有一些margin:0 auto居中的语句，由于定义在CSS文件中，对JSP文件也没有效果。
希望有谁可以帮忙看看，谢谢！
------解决方案--------------------
也遇到过同样问题，别的文件引用没问题，这个文件引用就出问题了（不是引用路径问题）。解决的办法是重新定义style，很麻烦。也想知道有没有什么好办法
mark下关注中。。。
------解决方案--------------------
我也碰见过这样的问题~很多时候都是删了重新定义过~具体什么原因还真不太清楚~
mark~关注...
------解决方案--------------------
在jsp中所有关于css js 的引用都用绝对路径，就不会有这样的问题
例如：
<link rel="stylesheet" type="text/css" href="/工程名/路径/CssStyle/main.css" />
<script src="/工程名/路径/JsScript/main.js" type="text/javascript"> </script>
------解决方案--------------------
<link href="${pageContext.request.contextPath}/style/table.css" type="text/css" rel="stylesheet" />
我在JSP中引用外部CSS文件，JSP文件如代码所示:
navigator.jsp代码如下（因代码过多，有部分省略，但不影响网页的运行）：
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css" href="CssStyle/main.css" />
<script src="JsScript/main.js" type="text/javascript"></script>
<title>计算机组成原理精品课程</title>
</head>
<body>
<div id="navigate">
<ul>
<li>首页</li>
<li>课程介绍</li>
<li onmousemove="switchMenu('teach')">教学资源</li>
<li>教学大纲</li>
<li onmousemove="switchMenu('activity')">实践教学</li>
<li>教学队伍</li>
<li网络课堂</li>
<li>论坛</li>
</ul>
</div>
<div id="teach" style="display:none;">
<ul>
<li>课件</li>
<li>教案</li>
<li>教学录像</li>
<li>教学条件</li>
<li>方针政策</li>
</ul>
</div>
<div id="activity" style="display:none;">
<ul>
<li>实践思路</li>
<li>基础性实验</li>
<li>设计性实验</li>
<li>实践效果</li>
<li>科技创新</li>
</ul>
</div>
</body>
</html>
main.css代码如下：
@CHARSET "UTF-8";
<!--设置主导航栏的样式-->
#navigate{
margin:0 auto;
width:1024px;
height:150px;
display:block;
background-color:#ffdd00;
border:2px solid;
}
#navigate ul {
line-height:30px;
clear:both;
}
#navigate ul li{
margin-right:15px;
list-style:none;
float:left;
}
<!--设置其他导航栏的样式-->
#activity,#teachMethod,#teach,#compus,#webClass{
margin:0 auto;
display:block;
}
#activity ul,#teachMethod ul,#teach ul,#compus ul,#webClass ul{
clear:both;
}
#activity ul li,#teachMethod ul li,#teach ul li,#compus ul li,#webClass ul li{
margin-right:30px;
list-style:none;
float:left;
}
仔细看过，CSS文件应该没什么问题，以前在HTML文件中是这样引用，但这次在JSP当中引用时，出现了一些问题：
就是当我引入CSS文件时，所有在当前JSP页面中定义的background-color等与背景有光的属性均没有效果，而且在CSS当中定义这些属性也没有用；
而当我把CSS引入的语句注释了之后，在页面当中的定义重新有效。另外还有一些margin:0 auto居中的语句，由于定义在CSS文件中，对JSP文件也没有效果。
希望有谁可以帮忙看看，谢谢！
------解决方案--------------------
也遇到过同样问题，别的文件引用没问题，这个文件引用就出问题了（不是引用路径问题）。解决的办法是重新定义style，很麻烦。也想知道有没有什么好办法
mark下关注中。。。
------解决方案--------------------
我也碰见过这样的问题~很多时候都是删了重新定义过~具体什么原因还真不太清楚~
mark~关注...
------解决方案--------------------
在jsp中所有关于css js 的引用都用绝对路径，就不会有这样的问题
例如：
<link rel="stylesheet" type="text/css" href="/工程名/路径/CssStyle/main.css" />
<script src="/工程名/路径/JsScript/main.js" type="text/javascript"> </script>
------解决方案--------------------
<link href="${pageContext.request.contextPath}/style/table.css" type="text/css" rel="stylesheet" />
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
