ホームページ ウェブフロントエンド htmlチュートリアル 初心者は古い知識を学ぶ (2) HTML アクティブ字幕を使用してマーキングする

初心者は古い知識を学ぶ (2) HTML アクティブ字幕を使用してマーキングする

Dec 26, 2016 pm 03:11 PM
html

アクティブ字幕。ローリングボードやローリング字幕とも呼ばれます。アクティブな字幕を使用すると、Web ページ全体がよりダイナミックで生き生きとしたものになります。今日の Web サイトでは、Web ページの対話性を高めるためにアクティブ サブタイトルがますます使用されています。 Javascript プログラミングを使用してアクティブな字幕効果を実現でき、Dreamweaver のレイヤーとそのタイムライン機能を使用して非常に美しいスクロール ボードを作成できます。 HTML アクティブ サブタイトル タグを使用すると、必要なコードが最小限に抑えられ、ダウンロード時間を短縮してより良い結果を得ることができます。このマークアップの構文形式は次のとおりです:


aligh=left|center|right|top|bottom
bgcolor=#n
direction=left|right|up|down
behavior=type
height=n
hspace=n
scrollamount=n
Scrolllay=n
width=n
VSpace=n
loop=n>

アクティブな字幕の表示方法が多様であるため、オプションのパラメータが多数あることがわかります。 。以下に各パラメータの意味を説明します:

Align: アクティブな字幕の位置を設定しますが、左、中央、右の 3 つの位置に加えて、上 (align=top) と下 (align) も追加します。 =下)2つのポジション。

Bgcolor: アクティブな字幕の背景色を設定するために使用され、通常は 16 進数です。

方向: アクティブな字幕のスクロール方向を左、右、上、または下に設定するために使用します。

Behavior: スクロール方法を設定するために使用されます。behavior="scroll" は、一方の端からもう一方の端までスクロールすることを意味します。behavior="slide": 繰り返さずに一方の端からもう一方の端まで素早くスライドすることを意味します。 ; behaviour="alternate" は、2 つの端の間で前後にスクロールすることを意味します。

高さ: ローリング字幕の高さを設定するために使用されます。

幅:ローリング字幕の幅を設定します。

Hspace と vspace: ローリング字幕の左右の境界線と上下の境界線の幅をそれぞれ設定するために使用されます。

Scrollamount: アクティブな字幕のスクロール距離を設定するために使用されます。

scrolllay: 2回スクロールする間の遅延時間を設定するために使用されます。

Loop: スクロール回数の設定に使用されます。loop=-1の場合、ページが更新されるまでスクロールすることを意味します。

タグのデフォルトの状況は、左に無限にスクロールすることです。字幕の高さはテキストの高さであり、スクロール範囲は、水平スクロールの幅が現在位置の幅です。現在位置の高さです。


アプリケーションのヒント

1. すべてのデフォルト値を使用し、最小限のコードを使用します。以下の例を参照してください

このローリング字幕はすべてのデフォルト値を使用します ソースコード:

ここに字幕の内容を書き込みます

、コードは珍しいですか?

2. 垂直スクロール

ここに字幕の内容を書いてください

など、direction="up"を追加するだけです。

3. 複数行テキストのアクティブな字幕

マークはテキストのセクションにのみ適用できるため、複数行のアクティブな字幕は別の行に分岐するときにのみ
でマークでき、

でマークすることはできません。

サンプルソースコード:


アクティブな字幕コンテンツの最初の行

アクティブな字幕コンテンツの2番目の行

アクティブな字幕コンテンツの3行目

4. 字幕コンテンツに画像を追加します

これはアクティブな字幕タグですが、画像を追加することができます。以下は画像を追加するコードです: 画像を追加するコードです

上記は初心者が学ぶべき古い知識です (2) HTML は、mar コンテンツをマークするためにアクティブな字幕を使用します。 PHP 中国語 Web サイト (www.php. cn) に注意してください。


このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

HTMLの表の境界線 HTMLの表の境界線 Sep 04, 2024 pm 04:49 PM

HTML の表の境界線に関するガイド。ここでは、HTML でのテーブルの境界線の例を示しながら、テーブル境界線を定義する複数の方法について説明します。

HTML のネストされたテーブル HTML のネストされたテーブル Sep 04, 2024 pm 04:49 PM

これは、HTML でのネストされたテーブルのガイドです。ここでは、テーブル内にテーブルを作成する方法をそれぞれの例とともに説明します。

HTML 左マージン HTML 左マージン Sep 04, 2024 pm 04:48 PM

HTML マージン左のガイド。ここでは、HTML margin-left の概要とその例、およびそのコード実装について説明します。

HTML テーブルのレイアウト HTML テーブルのレイアウト Sep 04, 2024 pm 04:54 PM

HTML テーブル レイアウトのガイド。ここでは、HTML テーブル レイアウトの値と例および出力について詳しく説明します。

HTML入力プレースホルダー HTML入力プレースホルダー Sep 04, 2024 pm 04:54 PM

HTML 入力プレースホルダーのガイド。ここでは、コードと出力とともに HTML 入力プレースホルダーの例について説明します。

HTML 内のテキストの移動 HTML 内のテキストの移動 Sep 04, 2024 pm 04:45 PM

HTML でのテキストの移動に関するガイド。ここでは、概要、マーキー タグが構文でどのように機能するか、および実装例について説明します。

HTML 順序付きリスト HTML 順序付きリスト Sep 04, 2024 pm 04:43 PM

HTML 順序付きリストのガイド。ここでは、HTML 順序付きリストと型の導入とその例についても説明します。

HTML の onclick ボタン HTML の onclick ボタン Sep 04, 2024 pm 04:49 PM

HTML オンクリック ボタンのガイド。ここでは、それらの紹介、動作、例、およびさまざまなイベントでの onclick イベントについてそれぞれ説明します。

See all articles