【问题标题】:How to add an icon to materialize tooltip?如何添加图标以实现工具提示?
【发布时间】:2017-03-29 18:00:15
【问题描述】:

我们有这个字体很棒的图标 fa fa-twitter,它在当前时间旁边的实际工具提示按钮旁边,我需要做的是把它放在工具提示中

<div class="center">
  <i class="fa fa-twitter"></i>
  <a class="btn tooltipped" data-position="bottom" data-delay="50" data-customcss="csszzz"  data-tooltip="I am tooltip" >Hover me!</a>
    </div>

我知道还有一个 data-customcss 实现,所以理论上我们可以通过 .css 实现它,也可以使用照片图标的 url 链接,但我不知道如何使用 angular

目前 data-customcss="csszzz" 没有做任何事情作为一个指向的 css 类,例如。 .csszzz

【问题讨论】:

    标签: angularjs materialize


    【解决方案1】:

    只需将data-html="true" 添加到您的锚元素并将图标移动到工具提示内:

    <div class="center">
      <a class="btn tooltipped" 
          data-position="bottom" 
          data-delay="50" 
          data-html="true"  
          data-tooltip="<i class='fa fa-twitter'></i> I am tooltip" >Hover me!</a>
    </div>
    

    请参考http://materializecss.com/dialogs.html#tooltip

    plunker:https://plnkr.co/edit/3cZtphZ984R1ZqnkuLBX?p=preview

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2017-02-28
      • 2013-03-08
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-08-03
      • 2022-01-07
      相关资源
      最近更新 更多