ホームページ > 記事 > ウェブフロントエンド > スクロールテキストを作成するHTMLコード
スクロールテキストを作成するHTMLコード
- 不言オリジナル
- 2018-05-07 16:13:015179ブラウズ
この記事では主にスクロールテキストを生成するための HTML コードを紹介します。必要な方は参考にしてください。このセクションでは、著者が の特別なタグについて説明します。 Web ページを作成できる HTML コード。テキスト内のテキストがスクロールし、そのスクロール プロパティを制御できます。
スクロールテキストを作成する この章のこれまでの研究を通じて、読者はさまざまな段落テキストの表示方法を適切に制御することができましたが、どのように設定されてもテキストは静的です。
このセクションでは、著者は、Web ページ内のテキストをスクロールし、そのスクロール プロパティを制御できる HTML コードの特別なタグについて説明します。
スクロールテキストを作成する
この章のこれまでの研究を通じて、読者はさまざまな段落テキストの表示方法を適切に制御することができましたが、どのように設定されてもテキストは静的です。このセクションでは、Web ページ内のテキストをスクロールし、そのスクロール プロパティを制御できる HTML コードの特別なタグについて著者が説明します。
4.3.1 テキスト スクロールを設定する
HTML テクノロジでテキストをスクロールする方法は、二重タグ ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b を使用することです。 HTML コードでは、スコープ内のテキストをスクロールできます。デフォルトでは、右から左への循環スクロールが可能です。 D:web ディレクトリに Web ページ ファイルを作成し、mar.htm という名前を付け、コード 4.15 に示すようにコードを記述します。 コード 4.15 テキスト スクロール設定: mar.htm
<html> <head> <title>文字滚动的设置</title> </head> <body> <font size="5" color="#cc0000"> 文字滚动示例（默认）：<marquee>做人要厚道</marquee> </font> </body> </html>
ブラウザのアドレス バーに http://localhost/mar.htm と入力すると、ブラウジング効果は図 4.15 のようになります。
図 4.15 テキストスクロールのデフォルト形式の設定
図 4.15 より、幅が設定されていない場合、ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b ラベルは排他的な行を占めます。
4.3.2 テキストのスクロール方向を設定する
ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b タグのdirection属性は、コンテンツのスクロール方向を設定するために使用されます。属性値は、左、右、上、です。と down は、それぞれ左、上、下を表します。たとえば、次のコード: 6c8a2d0b2120298f69aeb0347fedd6a7親切にしてください7204e33a7a23f6efcc788532e245c31b
008da1a6901990d3096a3855edda98d5親切にしてください7204e33a7a23f6efcc788532e245c31b
4.3 .3 テキストスクロールの速度と形式を設定します
テキストスクロールを設定するには、ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b タグを使用します。そのプロパティは次のように説明されます。 — ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b タグのscrollamount属性は、コンテンツのスクロール速度を設定するために使用されます。
— ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b タグの behaviour 属性は、コンテンツのスクロール方法を設定するために使用されます。その値が代替の場合、コンテンツは前後にスクロールします。ループ。値が slide の場合、コンテンツのスクロールは一度停止し、ループしません。スクロール サイクルの数を設定するループ属性もあります。デフォルトでは制限なしです。
— ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b タグのスクロール遅延属性は、コンテンツのスクロールの時間間隔を設定するために使用されます。
— ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b タグの bgcolor 属性は、コンテンツのスクロール背景色を設定するために使用されます (本文の背景色設定と同様)。
— ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b タグの width 属性は、コンテンツのスクロール背景の幅を設定するために使用されます。
— ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b タグの height 属性は、コンテンツのスクロール背景の高さを設定するために使用されます。
mar.htm Web ページ ファイルを変更し、コード 4.16 に示すようにコードを記述します。
コード 4.16 テキスト スクロール設定: mar.htm<html>
<head>
<title>文字滚动的设置</title>
</head>
<body>
<font size="3" color="#cc0000">
文字滚动示例（默认）：<marquee>做人要厚道</marquee>
文字滚动示例（向右）：<marquee direction="right" scrolldelay="500">做人要厚道</marquee>
文字滚动示例（向下，滚动方式为slide，速度为10）：<marquee scrollamount="10" behavior="slide">做人要厚道</marquee>
文字滚动示例（默认方向，滚动方式为alternate，循环3次，速度为2）：<marquee scrollamount="2" behavior="alternate" loop="3">做人要厚道</marquee>
文字滚动示例（向上，背景色为#CCFF66，设置了背景宽度和高度）：<marquee direction="up" bgcolor="#CCFF66" width="250" height="55">做人要厚道</marquee>
</font>
</body>
</html>
ブラウザのアドレス バーに http://localhost/mar.htm と入力すると、ブラウジング効果は図 4.16 に示すようになります。
図 4.16 さまざまな形式のテキスト スクロール
ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b の多くの属性により、テキストのスクロールが非常に便利になります。次の JavaScript の学習で、読者は ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b をさらに深めていきます。タグの動的行動学習。
関連する推奨事項:
以上がスクロールテキストを作成するHTMLコードの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。