是否可以在按钮元素上使用文本溢出：省略号？ [英] Is it possible to use text-overflow: ellipsis on a button element?

问题描述

我不确定是否可以在< button> text-overflow：ellipsis; $ c>元素。这是我的尝试： http://jsfiddle.net/WilsonPage/tK727/

I am not sure whether it is possible to use the text-overflow: ellipsis; style on a <button> element. Here is my attempt: http://jsfiddle.net/WilsonPage/tK727/

推荐答案

由于浏览器的限制，将按钮文本包装在例如a span 元素并设置其上的样式。示例（可作为 jsfiddle 使用）：

Due to limitations in browsers, wrap the button text inside e.g. a span element and set the styles on it. Example (available as jsfiddle too):

<style>
.buttontext {
  width: 95px;
  overflow: hidden;
  white-space: nowrap;
  display: block;
  text-overflow: ellipsis;
}​
</style>
<button><span class="buttontext">Very long text Very long text
Very long text</span></button>

这篇关于是否可以在按钮元素上使用文本溢出：省略号？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！