⊗mkSpGdEx 105 of 128 menu

明示的グリッド

グリッドシステムは、明示的および暗黙的なグリッドの使用を前提としています。 これらの概念について詳しく見ていきましょう。

明示的グリッドは、列と行に配置された要素のセットを表します。 多くの場合、明示的グリッドは手動で作成され、 これまでのレッスンで私たちが作成したすべてのグリッドは明示的なものです(例えば、 レッスングリッド内のタイル)。

では、明示的グリッドとなるテーブルを作成してみましょう:

<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: 1fr 1fr 1fr / 1fr 1fr 1fr; border: 2px solid #696989; padding: 10px; width: 400px; height: 400px; } #parent > div { padding: 10px; border: 1px solid #696989; }

:

日本語
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolEestiSuomiFrançaisहिन्दीMagyarՀայերենIndonesiaItalianoქართულიҚазақ한국어КыргызчаLietuviųLatviešuМакедонскиMelayuမြန်မာNederlandsNorskPolskiPortuguêsRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiSvenskaKiswahiliТоҷикӣไทยTürkmenTürkçeЎзбекOʻzbekTiếng Việt
当サイトでは、サイトの動作、分析、パーソナライゼーションのためにクッキーを使用しています。 データ処理はプライバシーポリシーに従って行われます。
すべて受け入れる 設定 拒否