HTML&CSS]Gridタグベース
Gridタグベース
CSSメッシュの2つの主要要素は、ラッピング(親要素)とアイテム(子要素)です.
パッケージは、メッシュを囲み、アイテムはメッシュ内部の要素です.
grid-template-rowとgrid-template-columnの使用
「行」(Row)と「列」(Column)の幅の高さを指定できます.
CSSメッシュの2つの主要要素は、ラッピング(親要素)とアイテム(子要素)です.
パッケージは、メッシュを囲み、アイテムはメッシュ内部の要素です.
.wrapper{
display: grid;
}
親divをgridに置き換えるには、displayプロパティをgridに設定します.grid-template-rowとgrid-template-columnの使用
「行」(Row)と「列」(Column)の幅の高さを指定できます.
ただし、3 x 3が定義されているが、3 x 2のみが表示される.
ここに3つのアイテムを追加すると、3 x 3が表示されます.
grid-column-start, grid-column-end,
grid-row-start, grid-row-end
アトリビュートを使用してグリッド線を指定すると、
一番左の行が1に指定されているので
上記の例では、右端の行数は4です.
Reference
この問題について(HTML&CSS]Gridタグベース), 我々は、より多くの情報をここで見つけました https://velog.io/@kyoung-jnn/HTML-CSS-Grid-태그-기초テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol