CSS
 Computer >> コンピューター >  >> プログラミング >> CSS

CSSオーバーフロー:自動


CSS オーバーフロー:自動オーバーフローとは異なり、必要な場合にのみスクロールバーを追加します :スクロール 。次のコードを実行して、CSS オーバーフローを実装することができます:auto プロパティ:

<!DOCTYPE html>
<html>
   <head>
      <style>
         div {
            background-color: orange;
            width: 250px;
            height: 45px;
            border: 2px solid blue;
            overflow: auto;
         }
      </style>
   </head>
   <body>
      <h1>Heading</h1>
      <div>Overflow property used here. This is a demo text to show the working of CSS overflow: auto. This won't hide the content. A scrollbar would be visible, only if needed.</div>
   </body>
</html>

出力

CSSオーバーフロー:自動


  1. CSSを使用してテキストの配置を設定する

    CSSを使用してテキストの配置を設定するには、text-alignプロパティを使用します。可能なプロパティ値は次のとおりです- text-align: left|right|center|justify|initial|inherit; 例 テキストの配置を設定する例を見てみましょう- <!DOCTYPE html> <html> <head> <style> .demo {    -webkit-columns: auto auto; /* Chrome, Safari, Opera */    -mo

  2. CSSオーバーフロープロパティの操作

    CSSオーバーフロープロパティは、ユーザーがコンテンツのサイズを変更せずに、小さなコンテナに大きなコンテンツを表示したい場合に便利です。このプロパティを使用すると、ユーザーはコンテンツをクリップしたり、クリップしたコンテンツを表示するためのスクロールバーを提供したり、コンテンツをコンテナの外にレンダリングしたりできるため、名前がオーバーフローします。 構文 CSSオーバーフロープロパティの構文は次のとおりです- Selector {    overflow: /*value*/ } CSSオーバーフロープロパティの値は次のとおりです- Sr.No 値と説明