0

我有一个固定宽度的按钮。在此按钮中有一个<b>带有名称的标签。名称是可变的,它可以比按钮的宽度长。

在浏览器中查看时,较长的文本不适合按钮。有没有办法将按钮文本连字符?文本没有“空格”但下划线:“_”。

4

4 回答 4

0

您可以使用 css text-overflow属性来指定用于表示剪切文本的自定义字符串。例如,

HTML

<div>
 some overflowing text
</div>

CSS

div{
 width:25px;
 height:30px;
 border:1px solid;
 overflow:hidden;
 white-space:nowrap;
 text-overflow: "_";
}

演示

于 2014-06-30T11:11:56.360 回答
0

您正在寻找的是text-overlow:'_';. 要使文本溢出,请使用以下 CSS:

button{
    width:100px;
  overflow: hidden;
  text-overflow: '_';
  white-space: nowrap;
}    

<button>My text is to long for me!</button>

JSFiddle Demo Ellipsis
(...) 也可以被text-overlow:ellipsis;

于 2014-06-30T11:12:59.923 回答
0

是的,您可以使用“连字符”CSS 属性来实现这一点。阅读更多关于 Word Hypernation

.button{
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
width:90px;
}

演示

于 2014-06-30T11:19:54.417 回答
0

我猜您希望长文本出现在有限宽度的按钮中。先看看DEMO

CSS

#test{
  display: block;
  width:100px;
  height:30px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: break-all;
  word-wrap: break-word;
}

HTML

<button type="button" id="test">text_hyphenation_within_a_html_button</button>
于 2014-06-30T11:31:37.690 回答