最新のWeb開発のチュートリアル
 

Style width Property

<スタイルオブジェクト

例

幅を設定し<button>要素を：

document.getElementById("myBtn").style.width = "300px";
»それを自分で試してみてください

定義と使用法

widthプロパティセットまたは幅の要素を返します。

widthプロパティは、ブロックレベル要素または絶対的または固定された位置を有する要素に影響を与えます。 オーバーフローコンテンツがオーバーフロープロパティで操作することができます。

ヒント：使用し、高さを設定または要素の高さを返すようにプロパティを。

ブラウザのサポート

Internet ExplorerFirefoxOperaGoogle ChromeSafari

widthプロパティは、すべての主要なブラウザでサポートされています。

構文

widthプロパティを返します：

object .style.width

widthプロパティを設定します。

object .style.width="auto| プロパティ値
値 説明
auto ブラウザが幅を設定します。 これがデフォルトです
length 長さの単位で幅を定義します
% 親要素の％の幅を定義します
initial このプロパティがデフォルト値に設定します。 最初の記事を読みます
inherit その親要素からこのプロパティを継承します。 継承についての記事を読みます

技術的な詳細

デフォルト値： オート
戻り値： 要素の幅を表す文字列、
CSSのバージョン CSS1

その他の例

例

幅の変更<div>要素を：

document.getElementById("myDIV").style.width = "500px";
»それを自分で試してみてください

例

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

document.getElementById("myImg").style.height = "300px";
document.getElementById("myImg").style.width = "300px";
»それを自分で試してみてください

例

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

alert(document.getElementById("myImg").style.width);
»それを自分で試してみてください

関連ページ

CSSチュートリアル： CSS寸法

CSSチュートリアル： CSSボックスモデル

CSSリファレンス： width property

<スタイルオブジェクト