CSS-オーバーフロー

説明

_overflow_プロパティは、要素のコンテンツ領域をオーバーフローするコンテンツの処理方法を決定します。

可能な値

visible -オーバーフローするコンテンツが表示されるはずです。
hidden -あふれているコンテンツは表示されません。
scroll -オーバーフローするコンテンツは表示されませんが、ユーザーエージェントは非表示のコンテンツにアクセスするための何らかの手段（たとえば、スクロールバーのセット）を提供する必要があります。
auto -この値によって引き起こされる動作はブラウザに依存します。

に適用されます

すべてのHTML要素。

DOM構文

object.style.overflow = "scroll";

例

ここに例があります-

<html>
   <head>
      <style type = "text/css">
         .scroll {
            display:block;
            border: 1px solid red;
            padding:5px;
            margin-top:5px;
            width:300px;
            height:50px;
            overflow:scroll;
         }
         .auto {
            display:block;
            border: 1px solid red;
            padding:5px;
            margin-top:5px;
            width:300px;
            height:50px;
            overflow:auto;
         }
      </style>
   </head>

   <body>

      <p>Example of scroll value:</p>

      <div class = "scroll">
         I am going to keep lot of content here just to show you how
         scrollbars works if there is an overflow in an element box.
         This provides your horizontal as well as vertical scrollbars.
      </div>
      <br/>

      <p>Example of auto value:</p>

      <div class = "auto">
         I am going to keep lot of content here just to show you how
         scrollbars works if there is an overflow in an element box.
         This provides your horizontal as well as vertical scrollbars.
      </div>

   </body>
</html>

これにより、次の結果が生成されます–

Css-overflow

CSS-オーバーフロー

説明

可能な値

に適用されます

DOM構文

例

目次