模拟title自定义样式

html的title是无法自定义样式的

解决方法:通过伪元素模拟一个自定义的title

html:

  定义一个data-title属性

<div class="order_type" v-for="item in journal_type_options":data-title='item.template_memo' :key="item.template_id">
</div>

css:

  通过hover显示来模拟tilte

  .order_type:hover::after {
    content: attr(data-title);
    position: relative;
    bottom: -1px;
    left: 15px;
    text-align: center;
    height: 24px;
    line-height: 22px;
    font-size: 14px;
    background-color: #fff;
    border-radius: 2px;
    color: #F40;
  }
原文地址:https://www.cnblogs.com/webwangjie/p/14809981.html