Dentro de un <ul>
elemento, claramente el espaciado vertical entre líneas se puede formatear con el atributo line-height.
Mi pregunta es, dentro de un <ul>
elemento, ¿cómo establezco el espacio vertical entre los elementos de la lista?
Dentro de un <ul>
elemento, claramente el espaciado vertical entre líneas se puede formatear con el atributo line-height.
Mi pregunta es, dentro de un <ul>
elemento, ¿cómo establezco el espacio vertical entre los elementos de la lista?
Respuestas:
HTML
<ul>
<li>A</li>
<li>B</li>
<li>C</li>
<li>D</li>
<li>E</li>
</ul>
CSS
li:not(:last-child) {
margin-bottom: 5px;
}
EDITAR: Si no usa el caso especial para el último elemento li, su lista tendrá un pequeño espacio después que puede ver aquí: http://jsfiddle.net/wQYw7/
Ahora compare eso con mi solución: http://jsfiddle.net/wQYw7/1/
Seguro que esto no funciona en navegadores más antiguos, pero puede usar fácilmente extensiones js que lo habilitarán para navegadores más antiguos.
:first-child
y funcionaría en todo IE7 +
Agregue un margin
a sus li
etiquetas. Eso creará un espacio entre li
y puede usar line-height
para establecer el espaciado del texto dentro de las li
etiquetas.
Muchas veces, al producir envíos masivos de correo electrónico HTML, no puede utilizar hojas de estilo o bloques de estilo / estilo. Todo CSS debe estar en línea. En el caso de que desee ajustar el espacio entre las viñetas, utilizo li style = "margin-bottom: 8px;" en cada elemento de viñeta. Personaliza el valor de los píxeles a tu gusto.
Para aplicar a una lista completa, use
ul.space_list li { margin-bottom: 1em; }
Luego, en el html:
<ul class=space_list>
<li>A</li>
<li>B</li>
</ul>
establecer padding-bottom para cada lista usando una pseudoclase es un método viable. También se puede utilizar la altura de la línea. Recuerde que las propiedades de la fuente, como la familia de fuentes, el peso de la fuente, etc., influyen en las alturas irregulares.
<br>
entre <li></li>
entradas de línea parece funcionar perfectamente bien en todos los navegadores web que he probado, pero no pasa el verificador en línea W3C CSS3. Me da precisamente el interlineado que busco. En lo que a mí respecta, dado que sin duda funciona, persisto en su uso, diga lo que diga el W3C, hasta que alguien pueda encontrar una buena alternativa legal.
ul li { margin: ???; padding: ???; line-height: ???; }
todos o algunos de esos atributos CSS.