导航栏边框没有改变颜色
[英]navigation bar border isn't changing colour
问题描述
我想更改导航栏上边框的颜色，但对我来说不起作用。 这是我的代码：
<!DOCTYPE html>
<html>
<head>
<title> site </title>
</head>
<style type="text/css">
body
{
background-color:#75b5d6;
color:white;
font-family:"Arial";
text-align:center;
}
a:link
{
color:white;
}
a:visited
{
color:white;
}
a:hover
{
color:white;
}
a:active
{
color:white;
}
.nav
{
border:3px solid white;
border-width:0px;
list-style:none;
margin:2;
padding:2;
text-align:center;
background-color:orange;
font-family:"Bookman Old Style";
}
.nav li{
display:inline;
}
.nav a
{
display:inline-block;
padding:10px;
}
h1
{
font-size:40;
font-family:"Lucida Handwriting";
}
h2
{
font-size:27.5;
text-decoration:underline;
}
p
{
font-size:12;
}
</style>
<body>
<h1> Kevril.net </h1>
<ul class="nav">
<li><a href="x">Home</a></li>
<li><a href="x">site1</a></li>
<li><a href="x">site2</a></li>
</ul>
<h2>Welcome</h2>
<p>Hellow</p>
</body>
</html>
我做错了什么？ 是在css部分还是html中？ 如果您能帮助我，我将非常高兴。 谢谢。
4 个解决方案
解决方案1
1 2013-03-26 17:08:14
我假设您的意思是.nav类。 如果是这样，您将：
border:3px solid white;
border-width:0px;
确保它具有宽度，您将看到设置的颜色。
解决方案2
0 2013-03-26 17:07:47
你有一个border-width:0px; 以.nav的样式显示，因此不会显示边框。 删除该行（无论如何，您都可以在速记border定义中设置宽度），它应该可以工作。
使用诸如Chrome的“ Inspect Element”之类的开发人员工具来进行此类操作非常方便，以帮助您确定破坏样式的方式。
（IE具有“开发人员工具”，而Firefox具有内置的类似功能，或者您可以安装firebug）
解决方案3
0 2013-03-26 17:08:18
这是因为您在.nav上指定了border-width:0; 。
即使您在border样式中指定了3px ，也可以有效地呈现没有宽度的border 。
把它拿下来，它的工作原理。
演示： http : //jsfiddle.net/cVNwn/
解决方案4
0 2013-03-26 17:09:43
删除border-width:0px; 从您的.nav ，它应该工作
演示： http ： //jsfiddle.net/zRQdj/
jQuery mouseenter函数-如果颜色尚未更改，则更改颜色
[英]jQuery mouseenter functions - changing colour if colour isn't already
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.