CSS - Como agregar mas estilos en CSS sin afectar a otras etiquetas.

 
Vista:
Imágen de perfil de Kong

Como agregar mas estilos en CSS sin afectar a otras etiquetas.

Publicado por Kong (2 intervenciones) el 21/10/2017 04:08:04
Buenas tardes, soy nuevo en CSS y no se mucho de esto, tengo una pregunta que me esta poniendo loco.
Cuando yo pongo una etiqueta en mi archivo index ex:
...(Esta div es para agregar una animación).
1
2
3
4
5
6
7
8
<div class="change">
   <div>
            <ul>
                <li>iphone</li>
                <li>imac</li>
                <li>ipod</li>
            </ul>
   </div>
Le agregue una animación.
(Esta div es para hacer un menú)
1
2
3
4
5
6
7
8
9
10
11
12
<div class="contenedor">
        <img class="logo" src="img/logo.png" alt="">
        <span class="icon-menu" id="btn-menu"></span>
        <nav class="nav" id="nav">
          <ul class="menu">
            <li class="menu__item"><a href="/" class="menu__link select">Inicio</a></li>
            <li class="menu__item"><a href="cursos.html" class="menu__link">Cursos</a></li>
            <li class="menu__item"><a href="docentes.html" class="menu__link">Docentes</a></li>
            <li class="menu__item"><a href="contacto.html" class="menu__link">Contacto</a></li>
          </ul>
        </nav>
</div>
Tiene su estructura tipo menú.
1
2
3
4
5
6
7
8
9
ul {
    list-style: none;
    padding-left: 135px;
    animation: cambiar 7s infinite;
}
 
ul, p {
    margin: 0;
}
/* Como agregué dos (ul) me esta ejecutando la animación en la smismas que les mostré arriba, mi pregunta es: Como le hago para que esta animacion solo haga efecto en li y ul de mi primera div y no en la segunda al mismo tiempo?
Un saludo a todos y espero sus respuestas.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de ScriptShow
Val: 571
Plata
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

Como agregar mas estilos en CSS sin afectar a otras etiquetas.

Publicado por ScriptShow (125 intervenciones) el 21/10/2017 22:48:40
Saludos,

tienes varias opciones. Veamos así:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<div class="change">
<ul>
<li>iphone</li>
<li>imac</li>
<li>ipod</li>
</ul>
</div>
 
<div class="contenedor">
<img class="logo" src="img/logo.png" alt="">
<span class="icon-menu" id="btn-menu"></span>
 
<nav class="nav" id="nav">
<ul class="menu">
<li class="menu__item"><a href="/" class="menu__link select">Inicio</a></li>
<li class="menu__item"><a href="cursos.html" class="menu__link">Cursos</a></li>
<li class="menu__item"><a href="docentes.html" class="menu__link">Docentes</a></li>
<li class="menu__item"><a href="contacto.html" class="menu__link">Contacto</a></li>
</ul>
</nav>
</div>
 
<style>
.change ul li:hover {
cursor: pointer;
list-style: none;
padding-left: 135px;
transition: all 4s;
}
 
ul, p {
margin: 0;
}
</style>

Espero sea útil.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
Imágen de perfil de Kong

Como agregar mas estilos en CSS sin afectar a otras etiquetas.

Publicado por Kong (2 intervenciones) el 24/10/2017 02:01:26
Donde iría todo el contenido de la etiqueta <style></style>?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de xve
Val: 624
Oro
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

Como agregar mas estilos en CSS sin afectar a otras etiquetas.

Publicado por xve (490 intervenciones) el 24/10/2017 08:18:03
La puedes poner donde quieras... en un archivo externo, en la cabecera o al final de la pagina... no importa donde este.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar