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

时间:2011-09-19 09:50:50

标签: html css

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

6 个答案:

答案 0 :(得分:92)

是的,您可以使用white-space 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;

答案 1 :(得分:35)

两个选项:

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

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

答案 2 :(得分:17)

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

white-space: normal

答案 3 :(得分:7)

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

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

如果你想自己休息一下。

答案 4 :(得分:1)

另一种改进和设计多行文字的方法是

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

   </button>

答案 5 :(得分:0)

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

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