În ultima lecție, am acoperit principiile de bază ale proprietății flotante. Dar, când utilizați proprietatea float, s-ar putea întâmpina, de exemplu, următoarea problemă.
Ce sa întâmplat? Elementul de bloc care a fost sub elementul cu float: proprietatea stângă pur și simplu a urcat până la locul unde ar fi fost dacă nu ar fi existat un element img cu proprietatea float left.
După cum se spune în acest caz, design-ul "sa rupt". Deci nu ar trebui să fie, fiecare element ar trebui să-și ia locul pe pagina web.
Pentru a rezolva această problemă, trebuie să puneți o interdicție de curgere pe blocul div, care este în partea de jos.
În CSS, pentru a rezolva această problemă este destul de simplă, trebuie să utilizați proprietatea clară. Dacă adăugați această proprietate unui element, acesta se oprește în jurul elementelor care au atribuit proprietatea float.
Sintaxa acestei proprietăți este:
nici unul - nu există nici o restricție de flux
stânga - fără flux pe partea stângă
dreapta - interzicerea curgerii pe partea dreaptă a laturii
ambele - o interdicție de flux pe ambele părți
moșteni - valoarea este moștenită de la elementul părinte
În majoritatea cazurilor, puteți utiliza valoarea clară: ambele, astfel încât să nu trebuiască să vă întrebați ce parte doriți să împiedica curgerea fluxului.
După cum puteți vedea, acum blocul și-a luat locul și nu mai este afectat de float: proprietatea stângă pentru elementul img.
Proprietatea clară este adesea folosită în practică atunci când o pagină web folosește obturarea obiectului cu proprietatea float. Utilizați această opțiune pentru a împiedica scăderea elementelor de blocare din fluxul normal atunci când faceți pagini web.
Poate că veți fi interesat de serviciul de aspect al paginilor mele. Apoi, faceți clic pe linkul de mai jos pentru a afla mai multe despre acest lucru.
Trimiteți-le prietenilor: