目次
widthの横幅の設定の違い
今回は「width」の使い方に関しまして、ご説明致します。
「max」がつくのとつかない場合で、用途は大きく違います!!
「max-width」と「width」の違いに関しましてご説明致します。
max-widthについて
横幅に「max-width」を設定した場合。
サンプル
1 2 3 4 5 6 7 8 9 |
<style> .box01{ border: 1px solid #ccc;/*外枠の線の設定*/ max-width: 900px;/*最大の横幅の設定*/ } </style> <div class="box01"> <p>max-widthた場合</p> </div> |
表示サンプル
このように全体がはみ出す事はありません。
maxで広がった時の大きさの設定を行なっているためです。
max-widthた場合
widthについて
横幅に「width」を設定した場合。
サンプル
1 2 3 4 5 6 7 8 9 |
<style> .box02{ border: 1px solid #ccc;/*外枠の線の設定*/ width: 900px;/*横幅の設定*/ } </style> <div class="box01"> <p>max-widthた場合</p> </div> |
表示サンプル
このように右側が切れていると思います。
これはこの横幅で設定と横幅の幅を決めてしまっているので
それいかに縮まる事はありません。
widthた場合