Question

我正在为未来的服装公司创建一个网站。我没有太多的编码经验，所以如果它有点草率，请耐心等待。我只想要一条完整的黑线穿过页面，使水平菜单变黑并删除下划线。我该怎么做？

<img border="0" src="http://www.miacreative.com/ESW/Images/WHITE-BOX-MID.png" alt="Vealed" width="280" height="81"> <li><a href="#">
    <li><a href="#">Men</a></li>
<img border="0" src="http://www.miacreative.com/ESW/Images/WHITE-BOX-MID.png" alt="Vealed" width="30" height="81">  
         <li><a href="#">Women</a></li>
<img border="0" src="http://www.miacreative.com/ESW/Images/WHITE-BOX-MID.png" alt="Vealed" width="30" height="81">
    <li><a href="#">Photography/Art</a></l

Answer 1

为锚标记添加了样式，并将hr标记的宽度更改为100％。

    <!doctype html>
<html>
<head>

<STYLE>
<!--
 a:hover{color:#000000;}
-->
</STYLE>

<p>&nbsp;</p>
<img border="0" src="http://img812.imageshack.us/img812/2628/rf3h.png" alt="Vealed" width="280" height="81">

<!-- This hr tag needed a 100% width, not 60% -->
<HR COLOR="black" WIDTH="100%">
<p>&nbsp;</p>

<!--Added a style here and referenced it in the class atribute of the anchor tags in the global nav. -->
<style>

    .navLink {
    color: #000000;    
    text-decoration: none !important;}

ul
{
list-style-type:none;
font-size: xx-large;
font-family: helvetica neue;
font-weight: lighter;

margin:0;
padding:0;
}
li
{
display:inline;
}

</style>


</head>
<body>


<ul id="nav" >

<img border="0" src="http://www.miacreative.com/ESW/Images/WHITE-BOX-MID.png" alt="Vealed" width="280" height="81"> <li><a href="#">
    <li>
        <!-- see the class attribute here -->
        <a href="#" class="navLink">Men</a>
        </li>
<img border="0" src="http://www.miacreative.com/ESW/Images/WHITE-BOX-MID.png" alt="Vealed" width="30" height="81">  
         <li><a href="#" class="navLink">Women</a></li>
<img border="0" src="http://www.miacreative.com/ESW/Images/WHITE-BOX-MID.png" alt="Vealed" width="30" height="81">
    <li><a href="#" class="navLink">Photography/Art</a></l



<p>&nbsp;</p>

<p>&nbsp;</p>
<p><p align="center"><img src='http://img547.imageshauuck.us/img547/3900/ehd.png' border='0'/></a><br>



  </ul>













</body>
</html>

Answer 2

您需要简单的CSS来改变链接的外观

将以下CSS添加到您的代码中

a, a:active, a:hover, a:visited {
  color: black;
  text-decoration: none;
}

Answer 3

这是你在找什么？

<!doctype html>
<html>
<head>
<style>
body{
margin: 0px;
padding: 0px;
}
img{
border: 0px;
}
#logo {
margin: 20px 0px 0px 20px;
}
#nav {
text-align: center;
list-style-type:none;
font-size: 36px;
font-family: helvetica neue;
font-weight: lighter;
margin: auto;
padding:0;
background: #000;
}
#nav li {
margin: 0px 20px;
display: inline;
}
#nav li a {

padding: 10px;
text-decoration: none;
color: #fff;
}
#nav li:hover{
background: #555;
}
</style>

</head>
<body>
<div id="logo">
<img src="http://img812.imageshack.us/img812/2628/rf3h.png" alt="Vealed Logo">
<hr align="left" color="yellow" style="height: 4px;" width="90%">
</div>
<ul id="nav">
<li><a href="#">Men</a></li>
<li><a href="#">Women</a></li>
<li><a href="#">Photography/Art</a></li>
</ul>
</body>
</html>

如何将此菜单设为黑色并删除下划线？

3 个答案: