Cuando manejamos una lista de definición en HTML esta se muestra en pantalla con el término en una línea y la definición en la siguiente línea. Mediante Bootstrap tenemos la posibilidad de crear listas de definición horizontales.
De esta manera las listas de definición hotizontales en Bootstrap nos mostrarán el término seguido de la descripción en una misma línea. Y todo centrado dentro de la página. Algo parecido a:
Término 1. Definición 1. Término 2. Definición 2. Término 3. Definición 3. … Término N. Definición N.
Lo primero que tenemos que hacer para poder crear listas de definición horizontales en Bootstrap es crear la lista de definiciones mediante un elemento dl
.
- ...
Luego cada uno de los términos y descripciones utilizaremos los elementos dt
y dd
respectivamente.
- Termino
- Descripción
Con esta información podremos crear nuestra primera lista de definiciones:
- Pizpireta
- Dicho de una mujer: Viva, pronta y aguda.
- Pulular
- Dicho de las personas, animales o cosas: Abundar y bullir en un lugar.
- Concupiscencia
- En la moral católica, deseo de bienes terrenos y, en especial, apetito desordenado de placeres deshonestos.
Ahora para poder obtener listas de definición horizontales en Bootstrap vamos a utilizar la clase "dl-horizontal"
sobre el elemento dl
.
- Pizpireta
- Dicho de una mujer: Viva, pronta y aguda.
- Pulular
- Dicho de las personas, animales o cosas: Abundar y bullir en un lugar.
- Concupiscencia
- En la moral católica, deseo de bienes terrenos y, en especial, apetito desordenado de placeres deshonestos.
De esta forma ya habremos conseguido tener listas de definición horizontales en Bootstrap.