「CSS」scrollでスクロールで表示するサンプル

2021年11月1日

書式
overflow: scroll;
使用例

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<style>
.cftA,.cftB {
border: 1px solid #000;
width: 160px;
height: 50px;
background: SkyBlue;
/*表示領域を超えた分はスクロールで表示*/
overflow: scroll;
}
</style>
<p class="cftA">test12345678test123456789test111(overflow)</p>
<p class="cftB">scroll値内容は、必要に応じてパディングボックスに合わせて切り取られます。</p>
<style> .cftA,.cftB { border: 1px solid #000; width: 160px; height: 50px; background: SkyBlue; /*表示領域を超えた分はスクロールで表示*/ overflow: scroll; } </style> <p class="cftA">test12345678test123456789test111(overflow)</p> <p class="cftB">scroll値内容は、必要に応じてパディングボックスに合わせて切り取られます。</p>
<style>
  .cftA,.cftB {
    border: 1px solid #000;
    width: 160px;
    height: 50px;
    background: SkyBlue;
    /*表示領域を超えた分はスクロールで表示*/
    overflow: scroll;
  }
</style>
<p class="cftA">test12345678test123456789test111(overflow)</p>
<p class="cftB">scroll値内容は、必要に応じてパディングボックスに合わせて切り取られます。</p>

 

CSS

Posted by arkgame