Bootstrap alapok

 A mai világban el sem képzelhető a weboldal reszponzitivitás nélkül. Ennek egyik alapja a Bootstrap. De mi van ha helyben akarjuk tárolni a fájlokat, ami alapban azt kínálja, hogy tároljuk a segító oldalakat online? Erre egy minta. 

Az első lépésként töltsük le a bootstrap fájlait.

Letöltési hely

A kicsomagolás után rakjuk az index állományunk mellé. Figyeljünk arra, hogy a fájlok két könyvtárban találhatóak (CSS,JS). Amikor ez megtörtént, a html head részébe rakjuk a hivatkozást:

 <link href="css/bootstrap.min.css" rel="stylesheet">

 <script src="js/bootstrap.bundle.min.js">

 A body részre a következő kerülhet:

 <div class="container">

        <div class="row">

            <div class="col-sm-3">

                <h3>Column 1</h3>

                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>

                <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>

            </div>

            <div class="col-sm-3">

                <h3>Column 2</h3>

                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>

                <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>

            </div>

            <div class="col-sm-3">

                <h3>Column 3</h3>

                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>

                <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>

            </div>

        </div>

    </div>

A program 12 oszlopra osztja a képernyőt. Ebből a minta 9-et foglal el. Lehet tesztelni, hogy a 4-ik hármas részre tudunk e berakni egy újabb oszlopot.

      <div class="col-sm-3">

                <h3>Column 3</h3>

                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>

                <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>

            </div>

Az oszlop amit be kell emelni ez....