怎么我可以用回车在HTML提示?
https://stackoverflow.com/questions/358874
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russian题
目前，我正在添加详细的提示我们的网站，我想(而不必诉诸飕飕爆炸jQuery插件，我知道有很多！) 使用马车返回到格式的提示。
添加尖我在使用 title 属性。我看了看四周通常的站点和使用基本的模板：
<a title='Tool?Tip?On?New?Line'>link with tip</a>
我已经尝试了更换 ? 有：
<br />&013; / \r\nEnvironment.NewLine(我采用C#)
没有上述工作。这可能吗？
解决方案
它是那么简单的你会踢你自己...只要按输入!
<a title='Tool
Tip
On
New
Line'>link with tip</a>
Firefox不显示的多线工具提示在所有的，虽然它将代替换行什么也没有。
其他提示
的 最新的规范 允许进行的性格，这样一个简单的线路打破内部的特性或实体 (注意这个字符 # 和 ; 需要)的是确定。
试符10.它不会的工作在火狐虽然。:(
该文本显示(如果有的话)中的一个 浏览器的依赖的方式。小 提示的工作月数的浏览器。长 提示和线路的开创性工作在即 和野生动物(用
或 对于一个 新newline).Firefox和歌剧院不 支持换行。Firefox不会 支持长提示。
http://modp.com/wiki/htmltitletooltips
更新：
作为一月2015年Firefox不支持使用 插入一个分行在HTML title 属性。看到这段代码下面的示例。
<a href="#" title="Line 1 Line 2 Line 3">Hover for multi-line title</a>测试这种在即、铬、野生动物园，Firefox(最新版本2012-11-27):
在所有的他们...
还值得一提的是，如果设定的标题属性与Javascript这样的：
divElement.setAttribute("title", "Line one Line two");
它不会的工作。你必须更换，ASCII小数10ASCII进制的一个方式就是逃脱了Javascript。是这样的：
divElement.setAttribute("title", "Line one\x0ALine two");
作为的火狐12现在，他们支持行符使用进行HTML实体：
<span title="First line Second line">Test</span>
这一工作即是正确的根据5规范的 标题属性.
如果您使用的是jQuery:
$(td).attr("title", "One \n Two \n Three");
将工作。
测试在IE-9:工作。
作为一个贡献 
 解决方案，我们也可以使用 	 对标签的如果你需要做这样的事情。
<button title="My to-do list:
	-Item 2
	-Item 3
	-Item 4
		-Subitem 1">TEST</button>演示
我知道我迟到缔约方，但对于那些只是想看看这个工作，这里的一个演示： http://jsfiddle.net/rzea/vsp6840b/3/
HTML用于：
<a href="#" title="First Line
Second Line">Multiline Tooltip</a>
<br>
<br>
<a href="#" title="List:
• List item here
• Another list item here
• Aaaand another list item, lol">Unordered list tooltip</a>
会工作的所有专业浏览器上(即含)
我们有一个要求，我们需要测试所有这些，这里是我想分享的
document.getElementById("tooltip").setAttribute("title", "Tool\x0ATip\x0AOn\x0ANew\x0ALine")<p title='Tool
Tip
On
New
Line'>Tooltip with <pre>
new
line</pre> Works in all browsers</p>
<hr/>
<p title="Tool Tip On New Line">Tooltip with <code>&#13;</code> Not works Firefox browsers</p>
<hr/>
<p title='Tool Tip On New Line'>Tooltip with <code>&#10;</code> Works in some browsers</p>
<hr/>
<p title='Tool
Tip
On
New
Line'>Tooltip with <code>&#xD;</code> May work in some browsers</p>
<hr/>
<p id='tooltip'>Tooltip with <code>document.getElementById("tooltip").setAttribute("title", "Tool\x0ATip\x0AOn\x0ANew\x0ALine")</code> May work in some browsers</p>
<hr/>
<p title="List:
• List item here
• Another list item here
• Aaaand another list item, lol">Tooltip with <code>• </code>Unordered list tooltip</p>
<hr/>
<p title='Tool\nTip\nOn\nNew\nLine'>Tooltip with <code>\n</code> May not work in modern browsers</p>
<hr/>
<p title='Tool\tTip\tOn\tNew\tLine'>Tooltip with <code>\t</code> May not work in modern browsers</p>
<hr/>
<p title='Tool
Tip
On
New
Line'>Tooltip with <code>&#013;</code> Works in most browsers</p>
<hr/>我不相信它是。Firefox2修剪长的链接标题无论如何，他们真的应该只是用来传达一个少量的帮助文本。如果你需要更多的解释文本，我建议，这属于一个段落相关联的链接。你可能随后增加工具提javascript代码隐藏的那些段落，并显示他们的提示。这就是你最好的赌注越来越它的工作的跨浏览器的国际海事组织。

 <-这是案文需要插入进行返回。
在铬16和可能的早期版本中，可以使用" "。作为一个旁注," "也作品
至于谁 没有工作，你必须式的元素的线可见为： white-space: pre-line;
只是用这个:
<a title='Tool
Tip
On
New
Line'>link with tip</a>
你可以添加新的线对标题可通过使用这个 
.
只是使用JavaScript。然后与大多数与旧的浏览器。使用逃生顺序 换行。
document.getElementById("ElementID").title = 'First Line text \n Second line text'
从提供的信息的可访问性和使用的工具提示，使他们更大的与使用CR或断线以理解的是，事实上，各种各样的浏览器就无法/不会同意的基础表明，他们不顾有关无障碍。
根据这个 文章w3c的网站:
CDATA是一字符序列从文字符组， 可以包括性格的实体。用户代理商应该解释属性 值如下：
- 替换角色的实体的字符，
- 忽视线的饲料，
- 代替每个回车或卡与一个单一的空间。
这意味着，(至少)CR and LF不会在里面工作标题属性。我建议你使用的工具提插件。大多数的这些插件允许任意HTML须显示作为一个元素的提示。
此 
 应该工作如果仅使用一个简单的标题属性。
在引导弹出框只是使用 data-html="true" 和使用html data-content 属性。
<div title="Hello 
World">hover here</div>多好看的提示，可以手动创建的，并且可以包括HTML格式。
<!DOCTYPE html>
<html>
<style>
.tooltip {
position: relative;
display: inline-block;
border-bottom: 1px dotted black;
}
.tooltip .tooltiptext {
visibility: hidden;
width: 120px;
background-color: #555;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px 0;
position: absolute;
z-index: 1;
bottom: 125%;
left: 50%;
margin-left: -60px;
opacity: 0;
transition: opacity 0.3s;
}
.tooltip .tooltiptext::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: #555 transparent transparent transparent;
}
.tooltip:hover .tooltiptext {
visibility: visible;
opacity: 1;
}
</style>
<body style="text-align:center;">
<h2>Tooltip</h2>
<p>Move the mouse <a href="#" title="some text
more and then some">over</a> the text below:</p>
<div class="tooltip">Hover over me
<span class="tooltiptext">Tooltip text
some <b>more</b><br/>
<i>and</i> more</span>
</div>
<div class="tooltip">Each tooltip is independent
<span class="tooltiptext">Other tooltip text
some more<br/>
and more</span>
</div>
</body>
</html>
这是从 该w3schools后 这一点。 实验与上述代码在这里.
剃刀法
在这种情况下的ASP.NET 视你可以只是商店的标题作为一个变量使用 \r\n 它将工作。
@{
var logTooltip = "Sunday\r\nMonday\r\netc.";
}
<h3 title="@logTooltip">Logs</h3>
哈克的但是工作-(测试的铬和移动)
只是添加不断的空间，直到它打破了-你可能会有限制的提示大小取决于内容的数量，但对于小的文字信息这工作：
etc
尝试了一切之上，这是唯一为我工作-
使用 data-html="true" 并申请 <br>.
