El Codigo Fuente
Lista (OL, UL) de forma horizontal
por - 18/02/2011 a las 20:59 (1473 Visitas)
Las Listas son unos TAGS del HTML que nos permiten hacer algo como esto:
- Elemento 1
- Elemento 2
- Elemento 3
Pero a veces deseamos mostrarlo en linea, es decir, como si fueran elementos de un DIV o SPAN, uno al lado de otro... para eso a cada LI le aplicamos en siguiente el estilo 'style="display:inline;"'
y obtendremos lo siguiente:Código HTML:<ul> <li style="display:inline;">Elemento 1</li> <li style="display:inline;">Elemento 2</li> <li style="display:inline;">Elemento 3</li> </ul>
Lo ideal seria usar una definicion CSS para evitar repetir codigoCódigo:Elemento 1 Elemento 2 Elemento 3
Código HTML:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Documento sin título</title> <style type="text/css"> <!-- .navlist li { display: inline; padding-right: 20px; } --> </style> </head> <body> <ul class="navlist"> <li>Elemento 1</li> <li>Elemento 2</li> <li>Elemento 3</li> </ul> </body> </html>
Compartir
Etiquetas:
1 linea,
css,
definicion,
elementos,
en linea,
estilo,
horizontal,
listas,
menu,
quitar salto,
sin enter,
sin retorno 
- Categories
- HTML
Enviar por CorreoComments
Dejar Comentario Trackbacks
Total de Trackbacks 0
URL del Trackback:
Ver Entradas de Blog
Ir al Perfil
Marcar como Leído
