Flexboxを遊ぼう
- 6. CSS Flexboxの使い方は?
<div class="f-container">
<div class="f-item"></div>
<div class="f-item"></div>
<div class="f-item"></div>
<div class="f-item"></div>
<div class="f-item"></div>
</div>
Flexboxを使用する場合には、HTMLファイルにまず親要素とな
るコンテナ(f-container)を作成し、その中に子要素となるア
イテム(f-item)を作ります。
- 7. CSS Flexboxの使い方は?
<div class="f-container">
<div class="f-item"></div>
<div class="f-item"></div>
<div class="f-item"></div>
<div class="f-item"></div>
<div class="f-item"></div>
</div>
<style>
.f-container{ display:flex;}
</style>
Flexboxレイアウトを使用する場合には、CSSファイルで親要
素(コンテナ)にdisplay:flexを指定します。