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

JavaScriptでオーバーフローした場合、コンテンツの左端/右端をどのように処理する必要がありますか?


コンテンツがオーバーフローした場合、 overlayXによる回避策 左/右端の問題を解決し、スクロールを設定するためのプロパティ。巻物を追加すると、訪問者はコンテンツ全体を簡単に読むことができます。

次のコードを実行して、JavaScriptでオーバーフローしたときにコンテンツの左端/右端で何をするかを学ぶことができます-

<!DOCTYPE html>
<html>
   <head>
      <style>
         #box {
            width: 350px;
            height: 150px;
            background-color: orange;
            border: 3px solid red;
            white-space: nowrap;
            margin-left: 20px;
         }
      </style>
   </head>
   <body>
      <p>Click to use overflow property and set scroll.</p>
      <button type="button" onclick="display()">Set Scroll</button>
      <div id="box">
         <p>This is a div. This is a div. This is a div. This is a div. This is a div.</p>
         <p>This is a div. This is a div. This is a div. This is a div. This is a div.</p>
         <p>This is a div. This is a div. This is a div. This is a div. This is a div.</p>
         <p>This is a div. This is a div. This is a div. This is a div. This is a div.</p>
         <p>This is a div. This is a div. This is a div. This is a div. This is a div.</p>
         <p>This is a div. This is a div. This is a div. This is a div. This is a div.</p>
      </div>
      <br>
      <br>
      <script>
         function display() {
            document.getElementById("box").style.overflowX = "scroll";
         }
      </script>
   </body>
</html>

  1. JavaScript WITHステートメントの用途は何ですか?

    WITHステートメントは、指定されたプロパティのデフォルトオブジェクトを指定し、長くて長いオブジェクト参照を書き込まないようにするために使用されます。指定されたオブジェクトをスコープチェーンの先頭に追加します。 以下はJavaScriptのwithステートメントのコードです- 例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="

  2. CSSを使用してフレックスアイテムを水平に設定します

    フレックス方向を使用する 行の値を持つプロパティ フレックスアイテムを水平に設定します。 例 次のコードを実行して、行の値を実装してみてください- <!DOCTYPE html> <html>    <head>       <style>          .mycontainer {             display: flex;       &n