Form, webreference

előző ◈ a következő

Kivetése formák - ez az egyik erőssége a Bootstrap. A keret nem csak segít pozícionálni űrlap elemek a megfelelő sorrendben, hanem gondoskodik a szükséges elemek és azok kölcsönhatása a felhasználó.

Nézzük meg a mintát űrlapot jelentkezni az oldalra és annak Például nézd meg, hogyan kell dolgozni Boostrap formákat. Az 1. példában bemutatjuk a létrehozását alap formában, míg hozzáadása nélkül további osztályok.

1. példa Az űrlap a belépésre

Az űrlap néz unalmas (1.), Mivel bármely hézag nem tartalmazza.

Ábra. 1. Tekintse meg az eredeti formájában

Először is, adjunk hozzá egy szöveges mező és a jelszó mezőt osztályú forma-ellenőrzés. meg fogja változtatni a stílusát a szöveges mezők. Ezután meg kell csoportosítani a fejléc és a mező mögött, a köztük lévő távolság kisebb volt, mint máskor. hozzáad és az elem belsejében

form-csoport osztályban. Szintén változik a négyzetet a szöveg hozzáadásával azokat a

jelölőnégyzetet az osztállyal és kérjen egy másfajta gombra. 2. példa változását mutatja alakú.

2. példa alkalmazása osztályok

Ennek eredményeként, a forma más (ábra. 2).

Ábra. 2. Form

Egy-line formában

Ahhoz, hogy a forma tömörebb, az elem

Csak adj egy osztály forma-jeit. Forma elemek azt követően, hogy hosszúkás egy sorban (3.). Szintén a kódot kell távolítani

és .

Ábra. 3. Egy-line formában

A 3. példában, mutatja létrehozását egy formája.

3. példa Egy-line formában

Amikor méretének csökkentése az ablak formájában megszűnik, hogy egy egysoros, és a kezdeti a ábrán bemutatott formában. 2.

horizontális alak

Ez a fajta penész gyakran található a helyszínen, valamint a terepmunka címkét meg ugyanabban a sorban (4.).

Ábra. 4. Írja vízszintes formában

Ahhoz, hogy létrehozza ezt a fajta forma akarsz néhány lépést:

hogy hozzá egy osztályt forma vízszintes;
hogy hozzá egy osztályt ellenőrző-címkét. címke mezőt ezután igazodik a jobb széle és a központi vízszintes tengely a területen;
betakar és -ban
form-csoport osztályban;
használjon egy moduláris rács.

Már meg kellett küzdenie a 12 oszlopos grid moduláris, ezeket a készségeket, hogy ellenőrizzék a formatervezés. A címke felveszi két oszlopot, és a szélessége a területen - a fennmaradó tíz oszlopot. Ahelyett hozzáadásával további

add col-sm-2 osztály közvetlenül . olyan keveset számának csökkentése kód elemeit. Ami a négyzetet, és gombot, majd adja hozzá a class col-sm-offset-2. mozog a területen közvetlenül alatta a szöveg doboz (4. példa).

4. példa vízszintes alakja

Kapcsolódó cikkek

előző ◈ a következő