Listas Espaciadas en tus entradas
Esto es sencillo así que vamos al grano …
Digamos que tienes una lista de este tipo:
- Elemento A
- Elemento B
- Elemento C
… pero te gustaría que se viera así:
-
Elemento A
-
Elemento B
-
Elemento C
Y es que cuando tienes listas con mucho texto, ampliar el espacio entre cada elemento puede mejorar su legibilidad.
Hasta donde yo sé, hacer esto en el editor visual no es posible (a menos que crees un nuevo tipo de <ul> para los elementos de lista).
Para añadir espacio extra tienes que ir al editor HTML. En WordPress 2.5 elige la pestaña "HTML" del editor de entradas (en las versiones 2.x la pestaña se llama "Código").
Así sería tu código de lista original:
-
<ul>
-
<li>Elemento A</li>
-
<li>Elemento B</li>
-
<li>Elemento C</li>
-
</ul>
Pues bien, para crear espacios extra simplemente añade las etiquetas <p> y </p> al comienzo y final, respectivamente, de cada elemento de la lista. Sería algo así:
-
<ul>
-
<li><p>Elemento A</p></li>
-
<li><p>Elemento B</p></li>
-
<li><p>Elemento C</p></li>
-
</ul>
Luego guardas tu entrada Et voilà! Listas espaciadas.
Bitacoras
RSS
Blog EntreBlogs
Bocabit
Buscando Libertad
CiberPrensa
El Blog de
KnxDT
FreebsArg
Galaxia Blog
Ideas Geek
iPhoniac
Soy Plastic
Tecnodiva
Todos los Como
Verdadera Seducción
Un truco que funciona visualmente, pero que es incorrecto semánticamente. Incluso en vuestro ejemplo os salen mal los “bullets”
Poniendo una clase en la CSS que añada más margen a los li y yendo luego al editor HTML para añadir al UL el class nos ahorramos más pasos (si lo tenemos que hacer a menudo) y es más correcto.
Un saludo.
fernando, la verdad q tu blog me fue de mucha ayude para armar el mio, pero tengo una duda. se q no tiene que ver con este post, pero si me podes responder al mail te lo agradeceria
¿como coloco “idtabs” en mi blog?
y otra cosa.. anda “lento” el tema este, gray beauty… tarda en actualizarse, no reacciona rapido a los cambios… alguna posible solucion?
[...] AYUDA WORDPRESS, encuentro un truco muy básico para construir listas con algo más de separación, en lugar de [...]
Como?
Porque não, em seu CSS, usar:
li {margin-bottom:1em}
Funciona. Sua solução (), no meu Firefox, não funcionou.
Abraços
Buena opción si quieres que te salgan así todas las listas Alé, pero si solo lo quieres en una lista concreta mejor usar un truco temporal ¿no crees?
Gracias por tu aportación
Obrigado
verdade.
mas ainda sim temos uma solução CSS:
ul.espacios li {margin-bottom:1em}
e no seu post:
Item 1
Item 2
Item 3
imagina uma lista grande…
complicado colocar para cada , não?
bom o papo.
parabéns pelo blog e obrigado pelo espaço.
abs e saudações brasileiras!
ps: as tags se perderam no comentário anterior.
Si, olvidaste meterlas en un “code”
fernando aun espero tu respuesta, mi principal inquietud es el porque de la tardanza al editar el etilo imageless_gray_beauty
gracias
fede, este no es el post adecuado, aquí hablamos de otra cosa y sería offtopic, por eso no te he contestado, disculpa
No entiendo bien tu pregunta y te animo a pasarte por el foro y explicarnos algo mas el problema, en que situación suceder, etc.
Pues si, es válido el uso de “p” para cosas temporales, WP lo acepta. Lo que no entiendo es si se trata del WP 2.5 pero hay códigos que antes me aceptaba en los post y ahora no, tales como o . El asunto me trae desconcertado.
tales como: “”
Intento de nuevo colocar el código: “”. Disculpen.
Trata en insertarlo dentro de un code a ver si se ve
Si, eso funciona. Pero me gustaría saber como añadir líneas en blanco extras entre párrafos, ocasionalmente. Con versiones anteriores WP me aceptaba brake lines (br /). Pero WP 2.5.1 no. Tampoco me acepta el código que antes usaba
nini nada parecido, cuando quiero que el siguiente párrafo de texto comience al final de una imagen larga, o que no me escriba por los lados de una imagen pequeña que quiero centrar ocasionalmente. Si lo inserto en vista de código, como antes, WP parece rechazarlo hora, lo borra y lo deja sin efecto. ¿Alguien sabe por qué?Lo siento, pero no se mostró el código que quise colocar, ni encerrándolo entre las etiquetas “code”, así que lo repito entre paréntesis:
… el código que antes usaba: (br clear=”left” /) ni (br clear=”both” /) ni nada parecido…