Html <td title=""> 中的换行符
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/246438/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
newline in <td title="">
提问by spence91
Possible Duplicate:
How can I use a carriage return in a HTML tooltip?
可能的重复:
如何在 HTML 工具提示中使用回车?
I'd like to know if it's possible to force a newline to show in the tooltip when using title property of a TD. something like
我想知道在使用 TD 的 title 属性时是否可以强制在工具提示中显示换行符。就像是
<td title="lineone \n linetwo \n etc...">
Can this be done?
这能做到吗?
回答by RealHowTo
This should now work with Internet Explorer, Firefox v12+ and Chrome 28+
这现在应该适用于 Internet Explorer、Firefox v12+ 和 Chrome 28+
<img src="'../images/foo.gif'"
alt="line 1
line 2" title="line 1
line 2">
Try a JavaScript tooltip library for a better result, something like OverLib.
尝试使用 JavaScript 工具提示库以获得更好的结果,例如OverLib。
回答by Petr Tuma
One way to achieve similar effect would be through CSS:
实现类似效果的一种方法是通过 CSS:
<td>Cell content.
<div class="popup">
This is the popup.
<br>
Another line of popup.
</div>
</td>
And then use the following in CSS:
然后在 CSS 中使用以下内容:
td div.popup { display: none; }
td:hover div.popup { display: block; position: absolute; }
You will want to add some borders and background to make the popup look decent, but this should sketch the idea. It has some drawbacks though, for example the popup is not positioned relative to mouse but relative to the containing cell.
您将需要添加一些边框和背景以使弹出窗口看起来不错,但这应该可以勾勒出想法。但是它有一些缺点,例如弹出窗口不是相对于鼠标定位,而是相对于包含单元格。
回答by Stéphane Klein
The Extensible Markup Language (XML) 1.1 W3C Recommendation say
可扩展标记语言 (XML) 1.1 W3C 建议说
? All line breaks MUST have been normalized on input to #xA as described in 2.11 End-of-Line Handling, so the rest of this algorithm operates on text normalized in this way. ?
? 如 2.11 行尾处理中所述,所有换行符都必须在#xA 的输入上进行规范化,因此该算法的其余部分对以这种方式规范化的文本进行操作。?
The link is http://www.w3.org/TR/2006/REC-xml11-20060816/#AVNormalize
链接是http://www.w3.org/TR/2006/REC-xml11-20060816/#AVNormalize
Then you can write :
然后你可以写:
<td title="lineone 
 linetwo 
 etc...">
回答by Dave Van Meter
Using 

Works in Chrome to create separate lines in a tooltip.


在 Chrome 中使用Works 在工具提示中创建单独的行。
回答by Erez Cohen
Using 
didn't work in my fb app.
However this did, beautifully (in Chrome FF and IE):

在我的 fb 应用程序中使用不起作用。然而,这确实很漂亮(在 Chrome FF 和 IE 中):
<img src="'../images/foo.gif'" title="line 1<br>line 2">
回答by Ady
This should be OK, but is Internet Explorer specific:
这应该没问题,但特定于 Internet Explorer:
<td title="lineone
linetwo
etc...">
As others have mentioned, the only other way is to use an HTML + JavaScript based tooltip if you're only interested in the tooltip. If this is for accessibility then you will probably need to stick to just single lines for consistency.
正如其他人所提到的,如果您只对工具提示感兴趣,那么唯一的其他方法是使用基于 HTML + JavaScript 的工具提示。如果这是为了可访问性,那么您可能需要坚持使用单行以保持一致性。
回答by Gareth
If you're looking to put line breaks into the tooltip that appears on mouseover, there's no reliable crossbrowser way to do that. You'd have to fall back to one of the many Javascript tooltip code samples
如果您想在鼠标悬停时出现的工具提示中添加换行符,则没有可靠的跨浏览器方法可以做到这一点。您必须退回到众多 Javascript 工具提示代码示例之一