Liste in Bootstrap

Dupa cum deja stiati (din HTML) putem defini 3 tipuri de liste:

• Liste neordonate (ul) ce sunt marcate cu buline
• Liste ordonate (ol) ce sunt marcate cu numere.
• Liste de definire (dl) ce contin termeni si definitiile acestora

Lista neordonata unstyled

Probabil ati intalnit momente in care trebuia sa slimitati stilul default al unei liste neordonate din CSS. Ei bine, bootstrap ne pune la dispozitie o clasa ce face exact acest lucru.

    <ul class="list-unstyled">
        <li>Acasa</li>
        <li>Tutoriale
            <ul>
                <li>HTML</li>
                <li>CSS</li>
                <li>Bootstrap</li>
            </ul>
        </li>
        <li>Despre Mine</li>
        <li>Contact</li>
    </ul>

Lista Inline

Probabil ati fost nevoiti sa faceti un ul sa fie afisat inline (pentru un meniu probabil). Bootstrap ne pune la dispozitie o clasa ce face acest lucru pentru noi.

    <ul class="list-inline">
        <li>Home</li>
        <li>Despre Mine</li>
        <li>Categroii</li>
        <li>Servicii</li>
        <li>Contact</li>
    </ul>

Liste de definire

Iata cum putem crea o lista de fefinire orizontala in bootstrap:

<dl class="dl-horizontal">
            <dt>User Agent</dt>
	    <dd>An HTML user agent is any device that interprets HTML documents.</dd>
	    <dt>Client-side Scripting</dt>
	    <dd>Client-side scripting generally refers to the category of computer programs on the web that are executed client-side i.e. by the user's web browser.</dd>
	    <dt>Document Tree</dt>
	    <dd>The tree of elements encoded in the source document.</dd>
</dl>