我想创建像这样的html导航链接:
但我不知道隐藏html下划线以及如何更改默认的html颜色。你能告诉我如何做到这一点的基本例子吗?
答案 0 :(得分:3)
a{color: green; text-decoration: none;}
答案 1 :(得分:3)
我很有趣你已经有了一个导航栏。
要设置“a”的颜色,请使用“color:rgb(256,256,256);”或者你使用“color:#000000;”。
a{
text-decoration: none;
color: rgb(256,256,256);
}
答案 2 :(得分:3)
<强> HTML:强>
<ul>
<li>GeForce > <a href="#">Link 1</a></li>
<li>GeForce > <a href="#">Link 2</a></li>
<li>GeForce > <a href="#">Link 3</a></li>
</ul>
<强> CSS:强>
body {
background: #000;
}
ul {
list-style-type: none;
padding: 40px;
}
li {
color: #fff;
font-family: Arial;
font-size: 14px;
}
li > a {
color: #76b900;
text-decoration: none;
}
li > a:hover {
text-decoration: underline;
}
现场演示:jsFiddle
答案 3 :(得分:2)
要隐藏下划线并添加颜色,您的答案是CSS。
以下是您的示例:
HTML:
<ul class="navigation-list"> <!--the name 'navigation-list' is arbitrary-->
<li><a href="#">Home</a></li>
<li><a href="#">Products</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>
CSS:
ul.navigation-list {
background-color: rgb(30,30,30);
height:35px;
}
ul.navigation-list li{
float:left;}
ul.navigation-list li a{
padding:4px 8px;
text-decoration:none; /**this removes the underline part **/
color:rgb(250,250,250);
font-family:Verdana;
}
ul.navigation-list li a:hover{
text-decoration:underline; /**this adds the underline part **/
background-color:rgb(80,80,80);
}
JS在这里:http://jsfiddle.net/u9A5K/2/
如果您有任何疑问,请不要犹豫:)