web-dev-qa-db-ja.com

HTMLのタイトル属性に改行/改行文字を追加するにはどうすればよいですか

私はこれを使っています

<a href="#" title="select from 1: this 2: that" > Click here </a>

誰かがそれにカーソルを合わせると、すべてのテキストが1行で表示されます。

新しい行に表示する方法はありますか？

htmlcsshoveraccessibility
17
user26

&#013;または&#10;を使用できます。

<a href="#" title="select from 1: this &#013; 2: that" > Click here </a>


<a href="#" title="select from 1: this &#010; 2: that" > Click here </a>
28
skulled

これにアクセシビリティのタグを付けたので、最も堅牢なアプローチは情報のタイトルに依存しないことだと思います。

現在のHTML仕様 は、（たとえば、運動障害のため）マウスを使用できないがキーボードを使用して画面にツールチップ/タイトルテキストが表示されない人を使用することをお勧めしません。タッチスクリーンを使用している人はそれにアクセスできません。

スクリーンリーダーを使用するほとんどの人はタイトルテキストも認識しませんが、ほとんどのスクリーンリーダーでアクセスすることは可能ですが、デフォルトでは読み上げられないため、誰かがそれを探す必要があります。 （そして 他にも問題があります 。）

仕様では、これを改行に使用することを推奨しています。

タイトル属性の値に "LF"（U + 000A）文字が含まれている場合、コンテンツは複数行に分割されます。各「LF」（U + 000A）文字は改行を表します。

ただし、新しい行の表示はブラウザによって異なります（ HTMLツールチップでキャリッジリターンを使用するにはどうすればよいですか ）。

多くの人々はあなたの例のような指示に混乱するので、全体的なUIアプローチはもう少し考える必要があると思います。つまり、複数のオプションがある場合、それをクリックすると何が達成されますか？

良いリンクテキストを書く が困難な状況の場合、相互作用について X stackexchange に投稿します。

11
AlastairC

動的に生成する場合は、\ n

$(td).attr("title", "One \n Two \n Three");
10
Gaurav
<a href="#" title="select from 
1: this 
2: that" > Click here </a>
5
vishalkin