jsp中使用外部CSS不起作用
群里有没会CSS的高手。。。我在JSP页面中使用link连接CSS样式表,ulli标签总不起作用。直接把CSS定义放到JSP页面就能正常显示,是什么问题呢(在外部CSS表...
群里有没会CSS的高手。。。我在JSP页面中使用link连接CSS样式表,ul li标签总不起作用。直接把CSS定义放到JSP页面就能正常显示,是什么问题呢(在外部CSS表中定义的BODY标签能应用上)
css表:
.logo {
MARGIN: auto;
WIDTH: 1000px;
HEIGHT: 200px;
background-color: #FFFFFF;
left: auto;
right: auto;
}
BODY {
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
FONT-SIZE: 9pt;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-TOP: 0px;
FONT-FAMILY: arial;
TEXT-ALIGN: center;
background-color: #FDD9FB;
background-repeat: repeat-x;
background-position: top;
}
.menu {
font-family: "方正行楷简体";
width:1000px;
position:relative;
font-size:18px;
border: 1px solid #FFCCFF;
top: 159px;
float: left;
left: auto;
right: auto;
}
.menu ul {
padding:0;
margin:0;
list-style-type: none;
left: auto;
right: auto;
display: block;
}
.menu ul li {
float:right;
position: relative;
}
/*导航背景和字体色*/
.menu ul li a, .menu ul li a:visited {
display:block;
text-decoration:none;
color:#FFF;
border:1px solid #fff;
border-width:1px 1px 0 0;
line-height:40px;
height: 3px;
padding-left: 10px;
width: 139px;
background-color: #FF6699;
}
.menu ul li ul {
display: none;
}
table {
margin:-1px;
border-collapse:collapse;
font-size:1em;
}
/* specific to non IE browsers */
.menu ul li:hover a {
color:#fff;
background:#bd8d5e;
}
.menu ul li:hover ul {
display:block;
position:absolute;
top:40px;
margin-top:1px;
left:0;
width:150px;
}
.menu ul li ul li ul {
display: none;
}
.menu ul li ul li a {
display:block;
background:#faeec7;
color:#000;
height:auto;
line-height:1.2em;
width:129px;
padding-top: 5px;
padding-right: 10px;
padding-bottom: 5px;
padding-left: 10px;
}
.menu ul li ul li a.drop {
background-color: #FF6699;
}
.menu ul li ul li a:hover {
background:#c9c9a7;
color:#000;
}
/*#menu ul li ul li:hover ul {
display:block;
position:absolute;
left:150px;
top:0;
width:150px;
}
#menu ul li ul li:hover ul.left {
left:-100px;
}*/
jsp:
<link href="css/logo.css" rel="stylesheet" type="text/css">
<body>
<div class="logo">
<div class="menu">
<ul>
<li><a href="#">品牌搜索</a></li>
<li><a href="#">版主推荐</a></li>
<li><a href="#">雅娜丝护理</a></li>
<li><a href="#">雅娜丝护肤</a></li>
<li><a href="#">雅美姿护肤</a></li>
<li><a href="www.baidu.com">雅美姿彩妆</a>
<table><tr><td>
<ul>
<li><a href="#">眼部产品</a></li>
<li><a href="#">面部产品</a></li>
<li><a href="#">唇部产品</a></li>
<li><a href="#">甲部产品</a></li>
</ul>
</td></tr></table>
</li>
<li><a href="#">首页</a></li>
</ul>
</div>
</div>
</body>
</html>
谢谢大家,问题搞定了。。。现在有个新问题了。。。哈哈,就是我的二级菜单显示不出来。。。麻烦帮我看下 展开
css表:
.logo {
MARGIN: auto;
WIDTH: 1000px;
HEIGHT: 200px;
background-color: #FFFFFF;
left: auto;
right: auto;
}
BODY {
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
FONT-SIZE: 9pt;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-TOP: 0px;
FONT-FAMILY: arial;
TEXT-ALIGN: center;
background-color: #FDD9FB;
background-repeat: repeat-x;
background-position: top;
}
.menu {
font-family: "方正行楷简体";
width:1000px;
position:relative;
font-size:18px;
border: 1px solid #FFCCFF;
top: 159px;
float: left;
left: auto;
right: auto;
}
.menu ul {
padding:0;
margin:0;
list-style-type: none;
left: auto;
right: auto;
display: block;
}
.menu ul li {
float:right;
position: relative;
}
/*导航背景和字体色*/
.menu ul li a, .menu ul li a:visited {
display:block;
text-decoration:none;
color:#FFF;
border:1px solid #fff;
border-width:1px 1px 0 0;
line-height:40px;
height: 3px;
padding-left: 10px;
width: 139px;
background-color: #FF6699;
}
.menu ul li ul {
display: none;
}
table {
margin:-1px;
border-collapse:collapse;
font-size:1em;
}
/* specific to non IE browsers */
.menu ul li:hover a {
color:#fff;
background:#bd8d5e;
}
.menu ul li:hover ul {
display:block;
position:absolute;
top:40px;
margin-top:1px;
left:0;
width:150px;
}
.menu ul li ul li ul {
display: none;
}
.menu ul li ul li a {
display:block;
background:#faeec7;
color:#000;
height:auto;
line-height:1.2em;
width:129px;
padding-top: 5px;
padding-right: 10px;
padding-bottom: 5px;
padding-left: 10px;
}
.menu ul li ul li a.drop {
background-color: #FF6699;
}
.menu ul li ul li a:hover {
background:#c9c9a7;
color:#000;
}
/*#menu ul li ul li:hover ul {
display:block;
position:absolute;
left:150px;
top:0;
width:150px;
}
#menu ul li ul li:hover ul.left {
left:-100px;
}*/
jsp:
<link href="css/logo.css" rel="stylesheet" type="text/css">
<body>
<div class="logo">
<div class="menu">
<ul>
<li><a href="#">品牌搜索</a></li>
<li><a href="#">版主推荐</a></li>
<li><a href="#">雅娜丝护理</a></li>
<li><a href="#">雅娜丝护肤</a></li>
<li><a href="#">雅美姿护肤</a></li>
<li><a href="www.baidu.com">雅美姿彩妆</a>
<table><tr><td>
<ul>
<li><a href="#">眼部产品</a></li>
<li><a href="#">面部产品</a></li>
<li><a href="#">唇部产品</a></li>
<li><a href="#">甲部产品</a></li>
</ul>
</td></tr></table>
</li>
<li><a href="#">首页</a></li>
</ul>
</div>
</div>
</body>
</html>
谢谢大家,问题搞定了。。。现在有个新问题了。。。哈哈,就是我的二级菜单显示不出来。。。麻烦帮我看下 展开
5个回答
2015-12-16 · 做真实的自己 用良心做教育
千锋教育
千锋教育专注HTML5大前端、JavaEE、Python、人工智能、UI&UE、云计算、全栈软件测试、大数据、物联网+嵌入式、Unity游戏开发、网络安全、互联网营销、Go语言等培训教育。
向TA提问
关注
展开全部
原因可能是没有把外部CSS引进来,加入下列代码来解决:
<link href="/HR/css/top4.css" rel="stylesheet" type="text/css"/>使用link的方式将类样式引入进来,将这段代码最好放在<head></head>标签内部,主要是为了在页面第一次进行加载的时候就将类样式引入进来。
<link href="/HR/css/top4.css" rel="stylesheet" type="text/css"/>使用link的方式将类样式引入进来,将这段代码最好放在<head></head>标签内部,主要是为了在页面第一次进行加载的时候就将类样式引入进来。
展开全部
<link href="css/logo.css" rel="stylesheet" type="text/css">
问题就处在这里 是你 引用外部样式表时 路径 不对
我 就经常遇到 一直 用的 笨办法
就是 写 绝对路径
<link href="/项目名/文件夹名/css/logo.css" rel="stylesheet" type="text/css">
加油、、
问题就处在这里 是你 引用外部样式表时 路径 不对
我 就经常遇到 一直 用的 笨办法
就是 写 绝对路径
<link href="/项目名/文件夹名/css/logo.css" rel="stylesheet" type="text/css">
加油、、
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
你把.menu中的"方正行楷简体";换成“方正行楷”就好了 .
或者在CSS文件头部加上@charset "GB2312";
或者在CSS文件头部加上@charset "GB2312";
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
你的二级菜单是用CSS的? 写的太乱了,先用用这个参数吧z-index
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
好像css文件中不能有中文,去掉中文注释看看。我上次也是这个问题的。
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询