HTMLテキストの特殊効果

著者: Laura McKinney
作成日: 2 4月 2021
更新日: 20 11月 2024
Anonim
【HTML入門】#07.特殊な記述が必要な文字と改行
ビデオ: 【HTML入門】#07.特殊な記述が必要な文字と改行

コンテンツ

HTMLとCSSは、フォントサイズや背景色などの標準的な書式設定だけでなく、いくつかのクールなテキスト効果も生み出すことができます。 HTMLの特殊効果により、テキストが表示され、視聴者の注意を引く珍しい方法で動作します。それらを使用して、停止したページをアニメートしたり、単純なテキストを追加したりします。


HTMLテキストの特殊効果 (ポルカドットRF /ポルカドット/ゲッティイメージズ)

ドロップキャップ

ワープロでは、ねこが段落の最初の文字を拡大します。 HTMLとCSSを使用して、Webページにこの効果を再現できます。 "float"プロパティを使用して、大文字の文字とフォントサイズを揃えて、段落内の残りのテキストに対するサイズを大きくします。文字を "span"タグに入れます。

例:

Eこれは、floatプロパティを使用したドロップキャップ効果の例です。

ローリングテキスト

HTMLのマーキー効果(マージン)により、テキストはさまざまな方法で移動します。コード内の「direction」コマンドは、ブラウザにテキストの移動先(上下左右)を指示します。 "behavior"属性はテキストがどのように動くかを記述します。 「スクロール」属性は、テキストを表示領域を超えて移動させてから再表示します。 "スライド"コマンドはテキストを余白の終わりで停止させ、 "代替"コマンドはテキストを左右に移動させます。速度を決定するには "scrollamount"コマンドを使用し、数値が大きいほどスクロールは速くなります。

例:

テキストを丸める

タイトルマウスオーバー(mouseover)

HTMLのspanタグを使用すると、テキストが挿入されている領域にテキストを表示できます。たとえば、段落の概要を追加する場合は、spanタグを使用してテキストを挿入します。


例:

段落テキストはこちら