在导航栏中更改字体/文本颜色

时间:2016-02-10 04:13:43

标签: html css

我想更改导航栏的字体颜色。我试过颜色:xxx;字体颜色:xxx;到处都没有用。我在想什么是取消它但我无法弄清楚是什么。我要把它从红色变成白色。提前致谢

HTML:

 <ul id="drop-nav">
      <li><a href="homepage.html">Home</a></li>
      <li><a href="parks.html">Parks</a>
        <ul>
          <li><a href="magickingdom.html">Magic Kingdom</a></li>
          <li><a href="epcot.html">EPCOT</a></li>
          <li><a href="hollywoodstudios.html">Hollywood Studios</a></li>
      <li><a href="animalkingdom.html">Animal Kingdom</a></li>
        </ul>
      </li>
      <li><a href="kids.html">Kids</a></li>
      <li><a href="discounts.html">Discounts</a></li>
      <li><a href="events.html">Events</a></li>
      <li><a href="tips.html">Tips</a></li>

  </ul>

CSS:

<style type="text/css">
  ul {  /*remove bullets & margins & padding from list*/
    list-style: none;padding: 0px;margin: 2px; 
  }

  ul li {  /*navigation bar*/
    display: block;
    position: relative;
    float: left;
    border:2px solid black;
    font-size: 20px;
    width: auto;
    text-align: center;
    margin-left: 85px;
`  `margin-bottom: 30px;
`  `background-color: black;
      }
  li ul {display: none; }
  ul li a {display: block; background: red; padding: 5px 10px 5px 10px; text-decoration:none;
            white-space: nowrap; color: white; border: 2px solid black;
           }
   ul li a:hover {background: red; }
  li:hover ul {display: block; position: absolute; left: auto; right: 0; margin-right: -60px; }
  li:hover li {float: none;}
  li:hover a {background: red;text-decoration: none; color: black; text-align: center;  }
  li:hover li a:hover {background: #000; color: red;}
  #drop-nav li ul li {border-top: 0px; }

2 个答案:

答案 0 :(得分:0)

将你的CSS更改为此。我只关心你的文字颜色和背景颜色,

  ul li{
    background-color: red;
  }

  ul li a{
    text-decoration: none;
    color: white;
  }

  ul li:hover{
    background: white;
  }

  ul li a:hover{
    color: red;
  }

答案 1 :(得分:0)

在css中尝试!important

颜色:XXX!重要