2019-12-27から1日間の記事一覧

Flexbox | 子要素 | 横並び

例えば、こんなボックスが3つあるとします。 HTMLはこちらです(boxesという親クラスは、box1〜box3の子クラスを持っています)。 <body> <div class="boxes"> <div class="box1"> box1 </div> <div class="box2"> box2 </div> <div class="box3"> box3 </div> </div> </body> CSSはこちらです。 .box1 , .box2, .box3 { background-color: paleturquoise; width: 110px; font-s…

ボックスモデル

cssには、ボックスモデルという概念があります。 例えば、 こんな画面があるとします。 HTMLはこちらです。 <body> <div class="box"> BOX </div> </body> CSSはこちらです。 .box { background-color: paleturquoise; width: 230px; font-size: 100px; } border: 10px solid black; この1行をCSS…