it-swarm.cn

HTML:我可以多行显示按钮文本吗?

我有一个带有长文本的按钮,例如“单击此处开始播放”。我想控制宽度并以多行显示文本。有可能在html/css中吗?

46
Dagang

两种选择:

<button>multiline<br/>button<br/>text</button>

要么

 <input type="button" value="Carriage&#13;&#10;return&#13;&#10;separators" style="text-align:center;">
35
m.edmondson

是的,您可以使用空白css属性在多行中使用它:)

input[type="submit"] {
    white-space: normal;
    width: 100px;
}
<input type="submit" value="Some long text that won't fit." />

将此添加到您的元素

 white-space: normal;
 width: 100px;
96
Yhn

该CSS可能适用于<input type="button" ..

white-space: normal
17
Alex K

是的,您也可以像这样使用它

<button>Click here to<br/> start playing</button>

如果您想自己休息一下。

7
Allan Kimmer Jensen

改善多行文字样式的另一种方法是

 <button>Click here to<br/> 
     <span style="color:red;">start playing</span>

   </button>
1
Sijo Jose

您可以使用值之间的实体来分隔文本。请参见下面示例中的实体:

<input style="width:100px;" type="button" value="Click here &#x00A; to &#x00A; start playing">
0
NooNa MarJa