Disponibil pro float stânga și modul în care uniform plasate blocuri pe css div - exemple

Toate elementele care se găsesc pe nu este nimic mai mult decât pagina HTML ca dreptunghiuri. Și, practic doar două tipuri:
  1. bloc (blok), care ocupă întreaga lățime unde acestea sunt, și sunt separate de ceea ce este deasupra și dedesubtul lor. De exemplu, această etichetă DIV, P, H.
  2. încorporat (inline). De exemplu, SPAN, puternic, EM, A și IMG.

Pagina anterioară aspect a fost realizată prin intermediul unor tabele.

Rolul proprietății float a crescut după trecerea de la masă aspect pe div-aspect. Acest lucru se datorează faptului că float permite dezvoltator web pentru a include coloane fără a recurge la masă. Se poate lua valorile dreapta. la stânga. dar nu și centru.

Cu afișajul de proprietate: bloc; sau display: inline; convertim un tip într-un alt dreptunghi. De exemplu, lista UL, care are un număr de blocuri LI pot fi aranjate orizontal:

Atunci când se utilizează un dreptunghi proprietăți de float este un bloc, dar cu caracteristica: lățimea acesteia nu se va aplica tuturor conținutului. De exemplu, antet h3 arata ca:

l HEADER h3


Dacă el a seta afișajul de proprietate: inline;, atunci vom vedea ce sa schimbat nu numai lățimea, ci și distanța deasupra și dedesubtul elementului:

l HEADER h3


Dar dacă vreau să puneți componenta pe dreapta și de această dată adăuga text-align: dreapta;, obținem:

l HEADER h3


Este destul de diferit în cazul în care float: right;. Rețineți că distanța de mai sus și mai jos elementul a rămas neschimbat:

l HEADER h3


Și cum să se comporte elemente care sunt lângă titlul?

Textul superior rămâne neschimbat, ca un element plutitor nu poate fi plasat deasupra rândului în care a fost creat.

l HEADER h3

Dar textul roșu sub titlul, și va curge în jurul ei, în timp ce nu au nici stiluri suplimentare. Numai h3 înălțime este depășită, pagina va reveni la ordinea naturală.

A B C câteva elemente plutitoare vor urmări succesiunea locației sale.

ABDtext.


Iar alinierea se face de la marginea de jos a foarte litere care sunt pe de o parte.

A B C D Dacă vrem să-și încheie elementul a fost reziliat de la un moment dat (aici), se aplică proprietatea clară. Putem adauga într-o etichetă goală

Pentru a răspunde în mod uniform multiple dreptunghiuri bloc, cere-le aceeași lățime.