widthプロパティ

TOPページに戻る > CSS

スポンサード リンク

widthプロパティ

HTML要素の横幅を指定できます(paddingを含まない横幅)
値はpx、emなどの単位、親ブロック要素の割合を%で指定、auto (autoは表示できる幅まで広がります)
paddingの幅はwidthの幅には含まれません。paddingを指定している場合、widthの幅+paddingが要素の横幅になります

使い方(書式)

セレクタ { width: 値; }                                    

widthプロパティ

対応ブラウザ ie6 ie7 ie8 ie9 ie10 ie11 google Chrome safari fire fox opera
適用できる要素 ブロック要素とtd th input textarea select img
子要素へのスタイルの継承 しない

プロパティの値 説明
単位 px、emなどの単位
% パーセントで指定
auto 表示できる幅まで広がります

実際の指定方法

.hoge { width: 300px; }    /* 300pxの横幅に指定 */

.hoge2 { width: 50%; }     /* 親ブロック要素の50%の横幅 */

.hoge3 { width: auto; }    /* 表示できる幅まで広がります */

html部分

<div class="hoge">width: 300px;</div>
<br>
<div class="hoge2">width: 50%;</div>
<br>
<div class="hoge3">width: auto;</div>

実際の表示

width: 300px;

width: 50%;

width: auto;




(C)2012 ホームページ作成無料