Correct statement in menu listing CSS

2

I have a menu listing and would like to know the most correct way to declare in HTML + CSS.

HTML looks like this:

<ul class="menu">
    <li>Home</li>
    <li>Empresa</li>
    <li>Produtos</li>
    <li>Blog</li>
    <li class="logo"></li>
    <li>Onde Comprar</li>
    <li>Assistência</li>
    <li>Contato</li>
</ul>

As for CSS, I'd like some hint. Of course, I could put a class in every li and leave it any way I want, but I do not know if it would be ideal, I'd like to save code.

CSS looks like this:

ul.menu li{
    font-family: "nexa_boldregular";
    font-size: 12pt;
    text-transform: uppercase;
    color: #1d1d1b;
    display: inline;
    margin-right: 35px;
}

For example, if I wanted to style some li into specific, I'd have to assign a class to it, right? Like I did in logo . The ideal in CSS would be like?

.logo , li.logo , ul.menu>li.logo ?

    
asked by anonymous 25.08.2014 / 13:51

1 answer

3

Felipe,

Whenever you treat only one element, you can use ID . Being a group to which a common element will be assigned, then you use Classe

There is a% TAG of which I use to generally structure as follows:

<nav>
  <ul
    <li></li>
  </ul>
</nav>

Consecutively in CSS, I mean like this:

nav ul {
}

nav ul li{
}

That is, if you do not have a class, you will uncrack the elements and develop the tree. If you declare a style for nav , it will look for a% TAG of% within nav ul , idem ul that could be declared as nav for example.

On nav ul li , you can declare it uniquely but in sequential lines of your code, for organization, leave the menu content, fully clustered. That is, create "sectorizations".

    
25.08.2014 / 13:59