Fraktionella enheter fr i CSS-grid
Värden angivna i enheter fr
kan ta bråkform. Låt oss
ändra föregående exempel genom att ange
för den andra och tredje kolumnen en bredd
i bråktal:
<div id="parent">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>
<div>7</div>
<div>8</div>
<div>9</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;
}
:
Låt ditt grid ha tre kolumner.
Gör så att den tredje kolumnen
är 1.5 gånger större än den första
och den andra.
Låt ditt grid ha tre kolumner.
Gör så att den andra kolumnen
är 1.5 gånger större än den första,
och den tredje kolumnen 2.5
gånger större än den första.
