Style paddingRight 属性

定義と使用方法

paddingRight 属性を設定または返して、要素の右内余白を返します。

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

参照：

CSSチュートリアル：CSS 内側マージン

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

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

インスタンス

例1

<div>要素の右内余白を設定：

document.getElementById("myDIV").style.paddingRight = "50px";

自分で試してみてください

例2

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

document.getElementById("myDIV").style.paddingRight = "0px";

自分で試してみてください

例3

返り値：<div>要素の右内余白：

alert(document.getElementById("myDIV").style.paddingRight);

自分で試してみてください

例4

marginRightとpaddingRightの違い：

function changeMargin() {
  document.getElementById("myDIV").style.marginRight = "200px";
}
function changePadding() {
  document.getElementById("myDIV2").style.paddingRight = "200px";
}

自分で試してみてください

文法

paddingRight属性を返す：

object.style.paddingRight

paddingRight属性を設定：

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

属性値

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

技術的詳細

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

ブラウザサポート

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