请写一个html文字超出后隐藏并且如果是长文本的话就通过向左滚动的方式滚动显示如果不是长文本就正常显示的代码

这个功能可以通过CSS中的text-overflow属性和white-space属性来实现。以下是一个示例代码：

<div class="container">
  <p class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet magna euismod, fermentum orci vel, ultrices tellus.</p>
</div>

.container {
  width: 200px;
  overflow: hidden;
}

.text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.text:hover {
  overflow-x: scroll;
  white-space: initial;
}

解释一下代码的作用：

• 容器元素（.container）设置了固定宽度和overflow:hidden属性，这样就可以隐藏超出容器宽度的内容；
• 文字元素（.text）设置了white-space: nowrap属性，这样文字就不会换行；
• 为了在文字超出容器宽度时显示省略号，.text还设置了overflow:hidden和text-overflow: ellipsis属性；
• 当鼠标移动到文字上时，.text元素的样式会变化，overflow-x属性变成了scroll，这样就可以通过向左滚动的方式显示超出容器宽度的文字；同时，white-space属性也变成了initial，这样就可以让文字正常换行了。

这样，当文字没有超出容器宽度时，它就会正常显示；当文字超出容器宽度时，它就会被隐藏，并且通过鼠标滚动的方式显示