padding-rightプロパティ

TOPページに戻る > CSS

スポンサード リンク

padding-rightプロパティ

要素の枠線の内側に余白を指定します
padding-rightプロパティを使えば要素の内側の右に余白を作ることができます

使い方(書式)

セレクタ { padding-right: 値; }                                    

padding-rightプロパティ

対応ブラウザ ie6 ie7 ie8 ie9 ie10 ie11 google Chrome safari fire fox opera
適用できる要素 全てのhtml要素
子要素へのスタイルの継承 しない

プロパティの値 説明
単位 px、emなどの単位
% パーセンテージで指定。要素が表示できる幅に対しての割合
0 余白なし

実際の指定方法

.hoge {
 padding-right: 20px;    /* 右の余白を20pxに指定  */
 border: 1px solid #000; /* 枠線を表示  */
 text-align: right;      /* 文字を右寄せ  */
  }

.hoge2 {
 padding-right: 5%;      /* 右の余白を5%に指定 */
 border: 1px solid #000; /* 枠線を表示  */
 text-align: right;      /* 文字を右寄せ  */
  }

html部分

<div class="hoge">padding-right: 20px;</div>
<div class="hoge2">padding-right: 5%;</div>

実際の表示(わかりやすいように枠線をつけています)テキストを右寄せしています

padding-right: 20px;

padding-right: 5%;




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