Liste in Bootstrap

Bootstrap | Stefanescu Mihai | 2020-10-11

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>



Imi place ce faci aici
Daca iti place ce fac aici imi poti cumpara o cafea Buy Me a Coffee at ko-fi.com

Stefanescu Mihai
Programator de ~8 ani, am lucrat la proiecte din mai multe industrstrii, de la eCommerce la telecomunicatii la automatizari. In acest timp am folosi diferite tehnologii, de la PHP, MySQL, PostgreSql, RabbitMq, Redis, Memcached si altele.
       

Get in touch
Pentru nelamuriri, dubii, comentarii si chestii de pe suflet ne putem auzi pe Discord, Reddit sau poti deschide o discutie noua pe forum.

Posteaza un comentariu

Comentarii

Inca nu au fost postate comentarii, fii primul care posteaza un comentariu!

Club-ul este dedicat membrilor si ofera access la mai multe zone ale website-ului.

🗝ïļ Login 🌟 Register

🔖 Bookmarks ⊞
âœĻ Pentru a sustine aceasta comunitate am sa te rog sa te autentifici sau sa te inregistrezi!

🌊ïļ Discord ⊞

Folosim cookie-uri pentru a oferi functionalitatile critice ale aplicatiei Invata-Programare. Folosim cookie-uri si pentru a analiza traficul, pentru care e nevoie de consimtamantul dvs. explicit.

⮆ïļ