如何在HTML工具提示中添加换行符?
我尝试在工具提示中使用<br/>和\n,如下所示:
<a href="#" title="Some long text <br/> Second line text \n Third line text">Hover me</a>
然而,这是无用的,我可以在工具提示中看到文字<br/>和\n。任何建议都会很有帮助。
如何在HTML工具提示中添加换行符?
我尝试在工具提示中使用<br/>和\n,如下所示:
<a href="#" title="Some long text <br/> Second line text \n Third line text">Hover me</a>
然而,这是无用的,我可以在工具提示中看到文字<br/>和\n。任何建议都会很有帮助。
当前回答
只需添加一个数据属性
data-html =“真正的”
你可以开始了。
如。用法:
<i data-html="true" class="tooltip ficon-help-icon" twipsy-content-set="true" data-original-title= "<b>Hello</b> Stackoverflow"> </i>
到目前为止,它在我尝试过的大多数工具提示插件中都有效。
其他回答
只需使用实体代码
用于标题属性中的换行符。
<a title="First Line 
Second Line">Hover Me </a>
如果你用的是bootstrap4,那么这个是可行的。
<style>
.tooltip-inner {
white-space: pre-wrap;
}
</style>
<script>
$(function () {
$('[data-toggle="tooltip"]').tooltip()
})
</script>
<a data-toggle="tooltip" data-placement="auto" title=" first line 
 next line" href= ""> Hover me </a>
如果你在Django项目中使用,那么我们也可以在工具提示中显示动态数据,比如:
<a class="black-text pb-2 pt-1" data-toggle="tooltip" data-placement="auto" title="{{ post.location }} 
 {{ post.updated_on }}" href= "{% url 'blog:get_user_profile' post.author.id %}">{{ post.author }}</a>
& lt; br /比;如果你在使用qTip,你做了什么工作
只需添加一个数据属性
data-html =“真正的”
你可以开始了。
如。用法:
<i data-html="true" class="tooltip ficon-help-icon" twipsy-content-set="true" data-original-title= "<b>Hello</b> Stackoverflow"> </i>
到目前为止,它在我尝试过的大多数工具提示插件中都有效。
只需在脚本中添加以下代码片段:
$(function () {
$('[data-toggle="tooltip"]').tooltip()
});
当然如上所述,data-html的答案应该是“真”。这将允许您在title属性的值内使用html标记和格式。