ul.menu颜色不变

时间:2017-03-23 10:19:05

标签: html5 css3 colors

我尝试了几种方法,但是我没有改变颜色,必须在这里遗漏一些东西!

我需要将文本颜色更改为页脚上的所有较低链接,我该怎么办?

我的HTML

<!-- Footer -->
 <footer id="footer">
  <div class="inner">
    <p class="copyright">&copy; MY SITE - 2017 All Rights Reserved.</p>
   <ul class="menu">
    <li><a href="terms.html">Terms<span> of Use</span></a></li>
    <li><a href="privacy.html">Privacy<span> Policy</span></a></li>
    <li><a href="#">Downloads<span></span></a></li>
   </ul>
  </footer>

我的CSS:

#footer {
        padding: 5em 0 3em 0 ;
        background-color: #fff;
        text-align: center;
    }

        #footer > .inner {
            margin: 0 auto;
            max-width: calc(100% - 4em);
            width: 60em;
        }

        #footer .copyright {
            color: #000;
            font-size: 0.8em;
        }

        #footer .menu {
            color: #000;
            font-size: 0.7em;
        }

    ul.menu {
            padding: 0;
            list-style: none;
        }

            ul.menu li {
                padding: 0;
                display: inline-block;
                margin-left: 0.75em;
                padding-left: 0.75em;
                border-left: solid 1px;
                line-height: 1em;
            }

                ul.menu li:first-child {
                    margin-left: 0;
                    padding-left: 0;
                    border-left: 0;
            }

https://jsfiddle.net/g3m6orpg/

2 个答案:

答案 0 :(得分:3)

在css中使用这种方式

 ul.menu li a {  
     color : green;
  }

同时更新了小提琴链接,请检查https://jsfiddle.net/g3m6orpg/3/

答案 1 :(得分:0)

您可以使用

#footer ul li a { color:#000;}