文字超出内容的css解决方式

.pclass2Span {
  height: 100%;
  width: 100%;
  display: inline-block;
  overflow: hidden;
  /* 表示文本不会换行 在同一行继续 遇到标签为止 */
  white-space: nowrap;
  /* 超出文本对象溢出显示... */
  text-overflow: ellipsis;
}

<p class="pclass1">
              <!-- title 超出的部分 长时间点击显示 -->
              <span class="pclass2Span" :title="item.title">{{ item.title }}</span>
              <!-- <span>{{ item.val }}</span> -->
</p>

title属性 规定关于元素的额外信息
这些信息通常会在鼠标移动到元素上时显示一段工具提示文本(tooltip text) ；