1

Quero aplicar css a esses elementos

ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 200px;
    background-color: #f1f1f1;
}

li a {
    display: block;
    color: #000;
    padding: 8px 16px;
    text-decoration: none;
}

li a:hover {
    background-color: #555;
    color: white;
}

li {
    display: inline;
}

Mas, somente se pertencerem a uma classe x, como poderia fazer isto?

0

2 Respostas 2

2

Sim é possível de duas formas.

Uma caso vc quera colocar os elementos dentro de uma div pai por exemplo, ai a div que tera a .classex e tudo dentro dela poderá ser customizado com seu css

.classex ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 200px;
    background-color: #f1f1f1;
}

.classex li a {
    display: block;
    color: #000;
    padding: 8px 16px;
    text-decoration: none;
}

.classex li a:hover {
    background-color: #555;
    color: white;
}

.classex li {
    display: inline;
}
<div class="classex">
  <ul>
    <li><a href="#">classe x</a></li>
  </ul>
</div>


A outra forma é colocar a .classex no próprio elemento, dessa forma

ul.classex {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 200px;
    background-color: #f1f1f1;
}

li.classex a {
    display: block;
    color: #000;
    padding: 8px 16px;
    text-decoration: none;
}

li.classex a:hover {
    background-color: #555;
    color: white;
}

li.classex {
    display: inline;
}
<ul class="classex">
  <li class="classex"><a href="#">classe x</a></li>
</ul>

1

Informe o elemento juntamente com a classe que tu quer que ele pertença.

Exemplo:

li.teste {
color: blue;
}

a.teste {
color: red;
}
<li class="teste">Teste</li>
<li>Teste</li>
<br>

<a class="teste">Teste</a>
<br>
<a>Teste</a>

Caso eu tenha entendido errado sua pergunta, me fala que eu altero minha resposta.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .