Style paddingTop 属性

定義と用法

paddingTop 属性は、要素の上内余白を設定または返します。

インナースペース属性は、要素の枠線と要素の内容の間のスペースを定義します。

margin属性 および padding属性 要素の周りにスペースを挿入します。しかし、違いは、marginが枠線の周りにスペースを挿入するのに対し、paddingは要素の枠線内にスペースを挿入することです。

も参照してください：

CSSチュートリアル：CSS 内余白

CSS リファレンスマニュアル：padding-top属性

HTML DOM リファレンスマニュアル：padding属性

インスタンス

例1

<div>要素の上内余白を設定します：

document.getElementById("myDiv").style.paddingTop = "50px";

自分で試してみる

例2

<div>要素の上内余白を"normal"に戻します：

document.getElementById("myDiv").style.paddingTop = "0px";

自分で試してみる

例3

<div>要素の上内余白を返します：

alert(document.getElementById("myDiv").style.paddingTop);

自分で試してみる

例4

marginTopとpaddingTopの違い：

function changeMargin() {
  document.getElementById("myDiv").style.marginTop = "100px";
}
function changePadding() {
  document.getElementById("myDiv2").style.paddingTop = "100px";
}

自分で試してみる

文法

paddingTop属性を返す：

object.style.paddingTop

paddingTop属性を設定する：

object.style.paddingTop = "%|length|initial|inherit"

属性値

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

技術的詳細

デフォルト値： 0
返り値： 文字列で、要素の上内余白を表します。
CSSバージョン： CSS1

ブラウザのサポート

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