html リンクタグタイトル属性改行マウスホバープロンプトコンテンツ改行効果

オブジェクト上にマウスを移動したときにコンテンツ（タイトル属性の内容）を折り返す方法、HTML タイトルの折り返し方法の概要。

HTML の title 属性はデフォルトで 1 行で表示されます。行を折り返すにはどうすればよいでしょうか。ここで DIVCSS5 では、誰もが共有して使用できるように 2 つの行折り返し方法をまとめ、紹介しています。

1. タイトルコンテンツを直接ラップする

タイトルの内容を直接入力する場合は、「Enter」キーを押して行を折り返します。サンプルコードは次のとおりです。

コードをコピー

コードは次のとおりです。

<a href='https://www.jb51.net' target='_ablank'
title='タイトル: DIVCSS5
著者: DIVCSS5
更新日: 2013-05-17
推奨レベル: なしキーワード: タイトル改行ページネーション: ページネーションなし読解レベル: 普通'>html title attribute line break</a>

ブラウザ効果のスクリーンショット:

マウスをリンクテキストに移動してコンテンツを折り返す効果のスクリーンショット

2. HTMLタイトルの改行コードを使用する

改行用のコードには 2 種類あり、どちらも HTML タグ内のタイトルコンテンツが表示されるときに改行を実現できます。

1. 改行コードは次のとおりです。
「
」と「」

「
」のスペル:

& (アンド記号、キーボードの数字キー 7 と一緒) + # (ポンド記号) + 10 (アラビア数字の 10) + ; (小文字のセミコロン)

「」のスペル:

& (アンド記号、キーボードの数字キー 7 と一緒) + # (ポンド記号) + 13 (アラビア数字の 13) + ; (小文字のセミコロン)

上記のデジタル入力は半角英語形式で入力する必要があります。使用時には、改行が必要な箇所で改行記号コードを 1 つ (グループ) 選択するだけです。

2. サンプルコードは次のとおりです。

コードをコピー

コードは次のとおりです。

<a href="https://www.jb51.net"
title="1 行目
2 行目
3 行目">タイトル改行 1</a>
<a href="https://www.jb51.net"
title="説明 1説明 2説明 3">タイトル改行 2</a>

3. スクリーンショットの例