Fr mērvienība
Elastības mērvienība fr
apzīmē daļu vai frakciju no kopējā
izmēra telpā, kurā atrodas elements.
fr izmantošanas priekšrocība
ir tās pielāgošanās dažādiem
konteineriem vai ekrāna izšķirtspējām,
jo fr vienkārši sadala visu telpu norādītajā
frakciju (daļu) daudzumā bez saistības ar to precīzo
izmēru pikseļos.
Piemērs
Izmantosim īpašību
grid-template-columns,
lai pirmais un otrais
režģa kolonna aizņemtu vienu konteinera daļu,
bet trešā kolonna - trīs daļas:
<div id="parent">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>
</div>
#parent {
display: grid;
grid-template-columns: 1fr 1fr 3fr;
border: 2px solid #696989;
padding: 10px;
width: 600px;
}
#parent > div {
padding: 10px;
border: 1px solid #696989;
box-sizing: border-box;
border: 1px solid #696989;
}
:
Piemērs
Vērtības, kas norādītas fr mērvienībās,
var būt daļskaitļi. Mainīsim
iepriekšējo piemēru, norādot
otrajai un trešajai kolonnai platumu
kā daļskaitļus:
<div id="parent">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>
</div>
#parent {
display: grid;
grid-template-columns: 1fr 0.5fr 2.5fr;
border: 2px solid #696989;
padding: 10px;
width: 600px;
}
#parent > div {
padding: 10px;
border: 1px solid #696989;
}
:
Skatiet arī
-
mērvienība
px,
kura nosaka izmēru pikseļos -
mērvienība
em,
kura nosaka izmēru em -
mērvienība
rem,
kura nosaka izmēru rem -
mērvienība
%,
kura nosaka izmēru procentos -
mērvienība
vw,
kura nosaka izmēru vw -
mērvienība
vh,
kura nosaka izmēru vh -
mērvienība
vmax,
kura nosaka izmēru vmax -
mērvienība
vmin,
kura nosaka izmēru vmin