Hisia cha CSS grid-column-end
- Marudifu grid-column
- Pya zaidi grid-column-gap
Ufafanuzi na matumizi
Maneno ya grid-column-end inasababisha kusafirisha kwenye mstari mengi au inayofikia kwenye mstari wa kusasa (column-line).
Tazama mifano ya kufikia mawendo.
Tazama pia:
Kikata za CSS:CSS Grid Layout
Mfano
Mfano 1
Inasababisha "item1" kusafirisha kwenye mstari tatu:
.item1 { grid-column-end: span 3; }
Mfano 2
Wewe unaweza kutumia thamani ya column-line kuhusu mstari mengi ambayo unataka kusafirisha kwenye.
.item1 { grid-column-end: 3; }
Inayotumia KiCSS
grid-column-end: auto|span n|column-line;
Chaguo cha tabia
Kina | Maelezo |
---|---|
auto | Chaguo cha kuzingatia. Inayosababisha kusafirisha kwenye mstari mmoja wa kusasa. |
span n | Inasababisha kusababisha kusafirisha kwenye mstari mengi ya kusasa. |
column-line | Inasababisha kuwaanishwa kwenye mstari gani wa kusasa. |
Vitendo vya teknolojia
Chaguo cha kuzingatia: | auto |
---|---|
Kuwasiliana: | Hapana |
Tengeneza mifano: | Inasaidia. Tazama:Muhimu wa mifano. |
Safu: | CSS Grid Layout Module Level 1 |
Inayotumia KiJavaScript: | object.style.gridColumnEnd="5" |
Sasaidia ya browser
Maneno ya kina ya tabia huzingatia na msingi wa browser wa kwanza ambao husaidia hiyo tabia.
Chrome | IE / Edge | Firefox | Safari | Opera |
---|---|---|---|---|
57 | 16 | 52 | 10 | 44 |
- Marudifu grid-column
- Pya zaidi grid-column-gap