Cu toate acestea, înălțimea specificată în procente pentru proprietățile elementelor verticale este calculată diferit față de valorile procentuale pentru alte proprietăți.
Reguli pentru proprietățile verticale date în procente:
- Procentul pentru marginea superioară / marginea inferioară sau pentru umplutura depinde de lățimea unității părinte.
- Valoarea procentuală pentru înălțimea elementului depinde de înălțimea unității părinte (de asemenea, pentru înălțimea min / max). În plus, dacă înălțimea elementului strămoșilor, din care se calculează calculul, este egală cu valoarea automată. și acest element nu este absolut poziționat (înălțime: procente), atunci înălțimea elementului însuși devine egală cu cea auto, indiferent de procentele specificate.
- După cum vă amintiți, pentru altitudine valoarea implicită este automată.
- Valoarea procentuală pentru proprietățile superioare și inferioare ale elementului poziționat depinde de înălțimea unității părinte.
- Valorile procentuale nu pot fi utilizate pentru frontiere (frontieră)
Mai jos este un exemplu în care se stabilesc procentaje pentru proprietățile superioară / inferioară de umplere / margine ale unui articol plasat într-un container cu lățime fixă.
Notă, folosesc jQuery pentru a calcula și a afișa înălțimea, inclusiv indentarea elementului. Lățimea elementului părinte (1000px) și indentarea (100px) a elementului în sine sunt setate foarte simplu, astfel încât să puteți imagina mai ușor procesul de calculare a proprietăților verticale ale căror valori sunt date în procente.
După cum puteți vedea, înălțimea totală a blocului este de 300px. unde 100px este înălțimea blocului și 100px pentru indentarea de sus și de jos (10% din 1000px).
Dacă lățimea blocului nu este specificată, dimensiunile pentru marginea superioară / marginea inferioară sau pentru padding vor depinde de lățimea ferestrei browserului.
De ce depinde de lățimea containerului?
Gândește-te de ce așezarea verticală și marginea. dat în procent, depinde de lățimea unității părinte, am ajuns la o concluzie - din cauza controlului.
Mă duc mai departe și spun că stabilirea înălțimii elementului este o practică proastă (min-înălțimea este normală). Astfel, dacă doriți să specificați o margine verticală / umplutură, nu ar fi intuitiv să setați valorile pentru proprietățile de mai sus, în funcție de conținutul arbitrar. În schimb, este mult mai ușor să faceți un calcul pe baza lățimii - este mai evident și lățimea este, de obicei, stabilită și, dacă nu, atunci este clar care este dependența.
Articole similare
-
Țelină - proprietăți utile și efecte nocive asupra sănătății
-
Pomelo fructe proprietăți utile pentru bărbați ca afectează potența
Trimiteți-le prietenilor: