是否可以在两行中输出“提交”的值？答案

【问题标题】：Is it possible to output value of 'submit' in two rows?是否可以在两行中输出“提交”的值？
【发布时间】：2013-01-11 11:30:56
【问题描述】：

我有一个迷你表单，我需要将提交按钮的值的长文本分成两行，以便它适合父 div 的宽度。我尝试设置提交按钮的宽度，但这并没有成功。

【问题讨论】：

标签： html css submit-button

【解决方案1】：

使用<button type="submit"> 而不是<input type="submit">。这将允许您将按钮的内容提供为 HTML 而不是纯文本，从而允许您根据需要设置按钮内容的格式。

最基本的解决方案是手动添加换行符：

<button type="submit">Foo<br/>Bar</button>

当然，您还可以对按钮内容使用更高级的 CSS 布局。

See it in action.

【讨论】：

完美！实际上现在它不需要<br />，因为现在宽度由父 div 自动设置。干杯！

【解决方案2】：

将您想要的文本包装在<span> 中的第二行，然后：

span{
    display:block
}

【讨论】：

实际上 jon 建议的内容会起作用，我使用的是 <input type="submit" value="very long value text" /> 并且您无法添加任何 html...但感谢您的回答！

【解决方案3】：

<style>
.buttontext {
  width: 10px;
  white-space: wrap;
  display: block;
}
</style>
<button><span class=buttontext>Very long text Very long text
Very long text</span></button>

这会将文本包裹在所需的行上。

【讨论】：

【解决方案4】：

以下将在按钮上换行文本。请注意，我已经指定了宽度。

<input type="button" value="This is some text on the button" style="white-space:normal; width:100px;" />

【讨论】：