2

Estoy generando un menú simple con CSS y HTML, pero al querer eliminar los puntos de las listas hace un comportamiento raro.

body{
	margin:0px;
	padding: 0px;
}
ul >li 
{
	text-decoration:none;
	text-decoration-style:none;
}
<ul>
	<li>home</li>
	<li>item</li>
	<li>item</li>
	<li>item</li>
</ul>

Aclaración: Lo que me pareció realmente raro fue que al hacer otra cosa diferente, funcionara. Lo pondré aquí abajo y explicare.

El body es el mismo pero el otro cambia:

ul > li:hover{

  color:white;
  background-color:black;
  text-decoration: none;
  text-decoration-style:none;
}
<ul>
	<li>home</li>
	<li>item</li>
	<li>item</li>
	<li>item</li>
</ul>

Lo raro aquí es que sin el hover no funciona y con el hover, sí, aplica los cambios al pasar el mouse, sobre el li claro. ¿Por qué pasa esto? ¿Cómo solucionarlo?

Como información extra estoy usando la versión más reciente de Chrome y Visual Studio, y ya lo probé con Internet Explorer, y solo elimina el text-decoration cuando cambio el background a negro y el color a blanco.

6
  • 1
    Aclaración el html es un simple ul con 4 li solo que no los represento correcta mente
    – Ezequiel
    el 30 ene. 2017 a las 5:28
  • dale en el boton ejecutar de mi respuesta. de esa manera lo probaras el 30 ene. 2017 a las 5:41
  • elimina tus respuestas, si quieres comentar algo, dale en añade un comentario el 30 ene. 2017 a las 5:45
  • @x-rw listo quisiera saber si sabes de algún curso en donde expliquen bien como crear código CSS correctamente ya que tengo nociones de como funciona pero siempre me ocurren errores que no se como solucionar y me gustaría aprender mas
    – Ezequiel
    el 30 ene. 2017 a las 5:50
  • a mi me ayudo w3schools.com/css/default.asp ahi esta los estandares de toda la web el 30 ene. 2017 a las 5:52

1 respuesta 1

3

te falta

li{
  list-style:none
}

te dejo la solucion:

body{

margin:0px;
padding: 0px;
}
li{
  list-style:none
}
ul >li 
{

text-decoration:none;
text-decoration-style:none;
}


ul > li:hover{

color:white;
background-color:black;
text-decoration: none;
text-decoration-style:none;
}
<ul>
    <li>home</li>
    <li>item</li>
    <li>item</li>
    <li>item</li>
</ul>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.