What attribute to add to the span tag can have a prompt text similar to the alt of the picture after the mouse is moved in

What attribute to add to the span tag can have a prompt text similar to the alt of the picture after the mouse is moved in

We set no newline for the span tag, and an ellipsis will be displayed after exceeding it, but by default, there will be no complete text prompt when the mouse is moved in. You can add a title attribute to the span tag to get it done!

renderings

html code:

	<div class="header"
           v-on:mouseenter="onMouseEnter(true)">
        <span class="title"
              :title="title">{
    
    {
    
     title }}</span>
      </div>
      
// 强制不换行显示省略号样式 
// 注意 如果不是块元素需要加：display: inline-block;
.title {
    
    
      display: inline-block;
      font-size: 16px;
      font-weight: 600;
      color: #333;
      width: 90%;
      white-space: nowrap; /* 防止文本换行 */
      overflow: hidden; /* 超出部分隐藏 */
      text-overflow: ellipsis; /* 超出部分显示省略号 */
    }