SVGタイトル対HTMLタイトル属性

title属性：馴染みのある友達ですが、本当に役立ちますか？このように使用できます。

<div title="タイトル">
  私は「タイトル」を持つdivです
</div>

この要素の上にホバリングすると、タイトルが明らかになります。拡張された日付や時間を表示するなどのために使用できます。ただし、そのユーティリティは目撃されたマウスユーザーに限定されています。

IRE Aderinokunの研究は、特にその欠点を強調しています<abbr></abbr>要素。彼女はJavaScriptが強化したアプローチを提唱しています。 Jawsはタイトルを発表できますが、この機能はデフォルトでは有効になっていません。スクリーンリーダーのtitleの有効性は不明確であり、コンテキスト依存性を維持しています。

これが驚くべき発見です：これはうまくいきません：

<svg title="チェックアウト"></svg>

ホバーにはタイトルポップアップが表示されません。代わりに、これが必要です：

<svg><title>チェックアウト</title>
<desc>カートにバゲットとブロッコリーが付いたショッピングカートのアイコン。</desc></svg>

Firefox 79は、この方法のサポートを導入しました。タイトルポップアップのホバイル可能な領域には、SVG長方形全体が含まれます。

この調査は、独特の問題を説明する電子メールに由来しています。タイトルポップアップは、透明なものではなく、SVGの「満たされた」ピクセルにのみ登場しました。これは、aを使用する場合に再現性があることが証明されました

以上がSVGタイトル対HTMLタイトル属性の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。