How to add background in an inline list? And how to remove the default underline effect?

0

I'd like to add a background to this menu, how can I do that?

The background-color only adds color to the words and not to the whole. And also has this underline effect in the <nav> list that I'd like to remove.

  

HTMLCODE:

<!DOCTYPE><html><head><linkrel="stylesheet" href="_css/estilo.css">
    <meta charset="UTF-8">
    <title>Aprendendohtml</title>

    </head>
    <body>
        <header>
        <!--<img src="_img/logo.png" alt="Programador" id="logo">-->
        <nav id="menu">
        <p id="letreiro">MarceloSantos.com</p>
            <ul>
                <li><a  href="#inicio">ÍNICIO</a></li>
                <li><a  href="#portfolio">PORTFÓLIO</a></li>
                <li><a  href="#redes-sociais">REDES SOCIAIS</a></li>
                <li><a  href="#contato">CONTATO</a></li>
            </ul>
        </nav>

        </header>

        <footer>

        </footer>
    </body>
</html>
  

CSS Code:

body {

}
#letreiro {
    font-size: 50px;
    font-family: Impact, Charcoal, sans-serif;
    text-align: center;
    background-color: #2F4F4F;
    color: #BEBEBE;
    padding: 20px;

}
#menu ul li {
    display: inline;
    margin-left: 100;
    margin-right: 100;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
    color: #696969;
}
    
asked by anonymous 24.02.2018 / 19:01

2 answers

0

Menu is a id that references an object in the document so you need to use the sharp "#" in front of the markup:

#menu ul li {propriedades} 

If the reference were for a class, the dot comes forward:

.classe{propriedades}
    
24.02.2018 / 19:14
0

To remove the underline from a text suffice in your css use:

 #letreiro li a {
 text-decoration: none;
 }

I hope I have helped = D.

    
24.02.2018 / 19:36