blocks|key|1640579|text|Mootools在他们的'more+builder‘中也有一个很好的'Tips’类。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1640580|entityMap|0|LINK|mutability|MUTABLE|url|http://mootools.net/^0|0|8|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

<a href="http://mootools.net" rel="nofollow noreferrer">Mootools</a> also has a nice 'Tips' class available in their 'more builder'.

blocks|key|1425626|text|不，这是不可能的，浏览器有自己的方式来实现工具提示。你所能做的就是用Javascript创建一些像HTML工具提示一样的div+(主要是“在悬停时显示”)，然后按照你想要的方式设置样式。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1425627|这样，你就不必担心浏览器的放大或缩小，因为工具提示div中的文本是一个实际的HTML，它会相应地缩放。|1425628|请参阅Jonathan的post以获取一些好的参考资料。|offset|length|1425629|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/questions/484137/is-it-possible-to-format-an-html-tooltip#484144^0|0|0|C|4|0|0^^$0|@$1|2|3|4|5|6|7|P|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|Q|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|R|8|@]|9|@$F|S|G|T|1|U]]|A|$]]|$1|H|3|-4|5|6|7|V|8|@]|9|@]|A|$]]]|I|$J|$5|K|L|M|A|$N|O]]]]

No, it's not possible, browsers have their own ways to implement tooltip. All you can do is to create some div that behaves like an HTML tooltip (mostly it's just 'show on hover') with Javascript, and then style it the way you want.

With this, you wouldn't have to worry about browser's zooming in or out, since the text inside the tooltip div is an actual HTML, it would scale accordingly.

See Jonathan's <a href="https://stackoverflow.com/questions/484137/is-it-possible-to-format-an-html-tooltip#484144">post</a> for some good resource.

blocks|key|1640669|text|看起来你可以使用css和一个技巧(没有javascript)来做这件事：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1640670|http://davidwalsh.name/css-tooltips|offset|length|1640671|http://www.menucool.com/tooltip/css-tooltip|1640672|http://sixrevisions.com/css/css-only-tooltips/|1640673|http://csstooltip.com|1640674|entityMap|0|LINK|mutability|MUTABLE|url|1|2|3|http://csstooltip.com/^0|0|0|Z|0|0|0|17|1|0|0|1A|2|0|0|L|3|0^^$0|@$1|2|3|4|5|6|7|W|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|X|8|@]|9|@$D|Y|E|Z|1|10]]|A|$]]|$1|F|3|G|5|6|7|11|8|@]|9|@$D|12|E|13|1|14]]|A|$]]|$1|H|3|I|5|6|7|15|8|@]|9|@$D|16|E|17|1|18]]|A|$]]|$1|J|3|K|5|6|7|19|8|@]|9|@$D|1A|E|1B|1|1C]]|A|$]]|$1|L|3|-4|5|6|7|1D|8|@]|9|@]|A|$]]]|M|$N|$5|O|P|Q|A|$R|C]]|S|$5|O|P|Q|A|$R|G]]|T|$5|O|P|Q|A|$R|I]]|U|$5|O|P|Q|A|$R|V]]]]

it seems you can use css and a trick (no javascript) for doing it:

<a href="http://davidwalsh.name/css-tooltips" rel="noreferrer">http://davidwalsh.name/css-tooltips</a>

<a href="http://www.menucool.com/tooltip/css-tooltip" rel="noreferrer">http://www.menucool.com/tooltip/css-tooltip</a>

<a href="http://sixrevisions.com/css/css-only-tooltips/" rel="noreferrer">http://sixrevisions.com/css/css-only-tooltips/</a>

<a href="http://csstooltip.com" rel="noreferrer">http://csstooltip.com</a>

blocks|key|1425772|text|尝试使用实体代码，例如CR的&#013;、LF的&#010;和TAB的&#009;。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1425773|例如：|1425774|​|1425775|<div+title="1)&#009;A&#013;&#010;2)&#009;B">Hover+Me</div>|code-block|syntax|javascript|1425776|1425777|entityMap^0|E|6|O|6|Z|6|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|R|8|@$9|S|A|T|B|C]|$9|U|A|V|B|C]|$9|W|A|X|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|Y|8|@]|D|@]|E|$]]|$1|H|3|I|5|6|7|Z|8|@]|D|@]|E|$]]|$1|J|3|K|5|L|7|10|8|@]|D|@]|E|$M|N]]|$1|O|3|I|5|6|7|11|8|@]|D|@]|E|$]]|$1|P|3|-4|5|6|7|12|8|@]|D|@]|E|$]]]|Q|$]]

Try using entity codes such as <code>&amp;#013;</code> for CR, <code>&amp;#010;</code> for LF, and <code>&amp;#009;</code> for TAB.

For example:

<div class="snippet" data-lang="js" data-hide="false">
<div class="snippet-code">
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div title="1)&amp;#009;A&amp;#013;&amp;#010;2)&amp;#009;B"&gt;Hover Me&lt;/div&gt;</code></pre>
</div>
</div>

blocks|key|1425849|text|不确定它是否适用于所有浏览器或第三方工具，但我已经成功地在工具提示中为newline指定了"\n“，至少在ie11，火狐和chrome中与dhtmlx一起工作|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1425850|for+(var+key+in+oPendingData)+{
++++var+obj+=+oPendingData[key];
++++this.cells(sRowID,+nColInd).cell.title+%2B=+"\n"+%2B+obj["ChangeUser"]+%2B+":+"+%2B+obj[sCol];
}|code-block|syntax|javascript|1425851|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

Not sure if it works with all browsers or 3rd party tools, but I have had success just specifying "\n" in tooltips for newline, works with dhtmlx in at least ie11, firefox and chrome

<pre><code>for (var key in oPendingData) {
 var obj = oPendingData[key];
 this.cells(sRowID, nColInd).cell.title += "\n" + obj["ChangeUser"] + ": " + obj[sCol];
}
</code></pre>

blocks|key|1640930|text|我知道这是一个老帖子，但我想补充我的答案，以供将来参考。我使用jQuery和css来设计我的工具提示：(用于演示：http://cssglobe.com/lab/tooltip/02/)在我的静态网站上，这非常有效。然而，在迁移到Wordpress的过程中，它停止了。我的解决方案是把像 +and+这样的标签改成这样：&lt;br&gt;+and+&lt;span&gt;这对我有效。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1640931|entityMap|0|LINK|mutability|MUTABLE|url|http://cssglobe.com/lab/tooltip/02/^0|3Z|F|4O|R|1L|Z|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@$9|O|A|P|B|C]|$9|Q|A|R|B|C]]|D|@$9|S|A|T|1|U]]|E|$]]|$1|F|3|-4|5|6|7|V|8|@]|D|@]|E|$]]]|G|$H|$5|I|J|K|E|$L|M]]]]

I know this is an old post but I would like to add my answer for future reference.
I use jQuery and css to style my tooltips: easiest-tooltip-and-image-preview-using-jquery
(for a demo: <a href="http://cssglobe.com/lab/tooltip/02/" rel="nofollow">http://cssglobe.com/lab/tooltip/02/</a>)
On my static websites this just worked great. However, during migrating to Wordpress it stopped. My solution was to change tags like <code>&lt;br&gt; and &lt;span&gt;</code> into this: <code>&amp;lt;br&amp;gt; and &amp;lt;span&amp;gt;</code>
This works for me.

blocks|key|1425997|text|在引导工具提示中，只需使用data-html="true“|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1425998|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

In bootstrap tooltip just use data-html="true"

Is it possible to format an HTML tooltip?

E.g. I have a DIV with attribute title="foo!". When I have text-size of my browser zoomed in or out in, the text size of the tooltip remains unchanged. Is there a way to make the tooltip font scale with the browser setting?

Is it possible to format an HTML tooltip (title attribute)?

jQuery

是否可以设置HTML工具提示的格式？例如，我有一个title=属性为“foo！”的DIV。当我放大或缩小浏览器的文字大小时，工具提示的文字大小保持不变。有没有办法使工具提示字体随浏览器设置而缩放？

问是否可以格式化HTML工具提示(标题属性)？
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问是否可以格式化HTML工具提示(标题属性)？EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问是否可以格式化HTML工具提示(标题属性)？
EN