Elérhető pro float balra és mennyire egyenletesen elhelyezett blokkok a div css - példák

Mindazokat az elemeket, amelyek megtalálhatók az nem más, mint a HTML-oldal a téglalapok. És alapvetően csak kétféle lehet:
  1. blokk (blok), amely elfoglalja a teljes szélességében, hol vannak, és vannak elválasztva, ami felettük és alattuk. Például, ez a címke DIV, P, H.
  2. beágyazott (inline). Például a SPAN, erős, EM, A és IMG.

Előző oldal elrendezés végeztük táblázatokkal.

A szerepe a float tulajdonság után nőtt az átmenetet a table-layout a div-elrendezés. Ez annak a ténynek köszönhető, hogy az úszó lehetővé teszi a webes fejlesztő, hogy tartalmazza az oszlopok anélkül, hogy az asztalra. Meg lehet venni az értékeket jobbra. maradt. de nem központtól.

Az ingatlan display: block; vagy display: inline; konvertáljuk egyféle egy másik téglalapot. Például, UL lista, amely számos LI blokkok lehet elhelyezni vízszintesen:

Amikor egy úszó tulajdonságokkal téglalap egy blokk, de a jellemző: a szélessége nem alkalmazza az összes tartalmát. Például h3 fejléc így néz ki:

ez H3 fejrészt


Ha ő meg az ingatlan display: inline;, akkor látni fogjuk, hogy mi változott nemcsak a szélessége, hanem a távolság felett és alatt az elem:

ez H3 fejrészt


De ha azt akarom, hogy tegye rá az alkatrészt a jobb, és ezúttal add text-align: right;, kapjuk:

ez H3 fejrészt


Ez egészen más, ha float: right;. Vegye figyelembe, hogy a távolság felett és alatt az elem változatlan marad:

ez H3 fejrészt


És hogyan kell viselkedni elemek, amelyek címe mellett?

Felső szöveg változatlan marad, mint egy úszó elem nem helyezhető az a sort, amelyben azt létre.

ez H3 fejrészt

De a piros szöveg címszó alatt, és ez fog folyni körül, miközben azonban nem minden további stílusokat. Csak a magassága h3 leküzdeni, az oldal visszatér a természetes rend.

A B C Néhány úszó elemeket fogja követni szekvenciájában a helyét.

ABazDszöveget.


És az összehangolás végzi legalján szélén a betűk, amelyek az egyik oldalon.

A B C D Ha azt akarjuk, hogy lezárja az elem megszűnt egy adott pillanatban (itt), alkalmazza a világos ingatlan. Mi adhat meg egy üres címke

Annak érdekében, hogy egyenletes elhelyezésére több blokk téglalapok, kérje meg őket, azonos szélességű.