HTML：我可以在多行中显示按钮文本吗？

HTML: can I display button text in multiple lines?

提问by Dagang

I have a button with long text like "Click here to start playing". I want to control the width and display the text in multiple lines. Is it possible in html/css?

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

采纳答案by m.edmondson

Two options:

两种选择：

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

or

或者

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

回答by Yhn

Yes, you can have it on multiple lines using the white-space css property :)

是的，您可以使用 white-space css 属性将它放在多行上:)

input[type="submit"] {
    white-space: normal;
    width: 100px;
}

<input type="submit" value="Some long text that won't fit." />

add this to your element

将此添加到您的元素

 white-space: normal;
 width: 100px;

回答by Alex K

This CSS might work for <input type="button" ..:

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

white-space: normal

回答by Allan Kimmer Jensen

Yes it is, and you can also use it like this

是的，你也可以这样使用

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

if you want to make the break yourself.

如果你想自己休息。

回答by Sijo Jose

one other way to improve and style the multi-line text is

改进和设置多行文本样式的另一种方法是

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

   </button>

回答by NooNa MarJa

You can break a text using an entity in between the value. See the entity in example below:

您可以使用值之间的实体来断开文本。请参阅以下示例中的实体：

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