Style width属性

定義と使用法

width 属性で設定または返します。

width この属性はブロック要素や絶対的または固定位置を持つ要素に対してのみ有効です。オーバーフローされた内容は、 overflow属性 で処理します。

ヒント：次を使用して処理してください height属性 要素の高さを設定または返します。

参照してください：

CSSチュートリアル：CSS Dimension

CSSチュートリアル：CSS フレームワークモデル

CSSリファレンスマニュアル：width属性

例

例1

<button>要素の幅を設定します：

document.getElementById("myBtn").style.width = "300px";

実際に試してみましょう

例2

<div>要素の幅を変更します：

document.getElementById("myDIV").style.width = "500px";

実際に試してみましょう

例3

<img>要素の高さと幅を変更します：

document.getElementById("myImg").style.height = "300px";
document.getElementById("myImg").style.width = "300px";

実際に試してみましょう

例4

<img>要素の幅を返します：

alert(document.getElementById("myImg").style.width);

実際に試してみましょう

構文

width属性を返します：

object.style.width

width属性を設定します：

object.style.width = "auto|length|%|initial|inherit"

属性値

値 説明
auto ブラウザが幅を設定します。デフォルト。
length 幅を長さ単位で定義します。
% 親要素の幅をパーセントで定義します。
initial この属性をデフォルト値に設定します。参照してください initial。
inherit この属性を親要素から継承します。参照してください inherit。

技術的詳細

デフォルト値： auto
返り値： 文字列、要素の幅を示します。
CSSバージョン： CSS1

ブラウザのサポート

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
サポート サポート サポート サポート サポート