「CSS」paddingで要素の内側の余白を指定するサンプル

2021年7月28日

書式
数値 + px
サンプルコード

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<style>
.cftA {
width: 150px;
border: 3px solid SkyBlue;
}
.cftB {
/*上 右 下 左を指定*/
padding: 15px 50px 20px 18px;
}
</style>
<div class="cftA">
<div class="cftB">テスト</div>
</div>
<style> .cftA { width: 150px; border: 3px solid SkyBlue; } .cftB { /*上 右 下 左を指定*/ padding: 15px 50px 20px 18px; } </style> <div class="cftA"> <div class="cftB">テスト</div> </div>
<style>
  .cftA {
    width: 150px;
    border: 3px solid SkyBlue;
  }
  .cftB {
  /*上 右 下 左を指定*/
    padding: 15px 50px 20px 18px;
  }
</style>
<div class="cftA">
  <div class="cftB">テスト</div>
</div>

 

CSS

Posted by arkgame