如何移动文本到新行与一个HTML输入元素type="button"
属性?
我有下面的代码:
<input type="button" id="btnTexWrapped" value="I see this is a long sentence here." style="width: 200px;" />
我想被包裹在两行按钮的文本价值。 我试了一下输入到HTML中的下一行。 如我所料它没有工作:
<input type="button" id="btnTexWrapped" value="I see this is a long
sentence here." style="width: 200px;" />
我使用的所有选项也尝试white-space
具有固定width: 200px;
,但仍然没有工作。
我行与静态固定的长度,宽度,或其他值:作为控制是不会改变。
试试这个,你可以看到它是如何工作的瞬间:
<input type="button" value="Carriage return separators" style="text-align:center;">
您可以使用按钮标签
<按钮>我看到这<BR/>是一个长期的<BR/>句话在这里。</按钮>
对于任何人4年之后阅读这个问题,我想补充一些细节澄清。 LOKESH的答案是正确的( 不接受的答案),但最初的问题是基于HTML如何工作的误解,这是任何人已经解决了。
HTML是不是一个空白显著语言。 也就是说,任何新线由浏览器完全忽略。 虽然你可以(也应该!)把新生产线在你的HTML代码,以写可读,可维护的HTML,它会(几乎)从来没有影响最终结果(我不会进入这里的例外)。
作为LOKESH指出,你可以使用<br />
标签强制新生产线。 另一种常见的方法是使用块级元素,诸如div
或section
。
一些元件被设置由浏览器UA样式表来阻止。 它们通常是容器元素,如<div>
<section>
,和<ul>
还文本“块”状<p>
和<h1>
块级元素不在线坐,但打破以往他们。 默认情况下(不设置宽度)它们占用尽可能多的水平空间,因为他们可以。
这是从报价https://css-tricks.com/almanac/properties/d/display/ ,这是针对不同的性能的很好的参考display
属性。
另外,我不建议尝试使用其它推荐的解决方案,需要把编码换行的符号里面的value
属性。 这是推动input
标签超出了它是专为。 如果您需要更复杂的内容为一个按钮,该button
标签是比较合适的。 事实上,我一般不认为有过很好的理由使用<input type="button">
代替button
标签。 它更语义,更易于阅读,而且是无限更灵活 - 例如,允许它里面休息和其他元素(如图片!)。
只是有点知识和专业的网络开发者一些建议的... :)
我来的要求的交叉型在我的项目之一,我喜欢解决下面给出。
使用HTML编码字符串
<input button type="submit" value="This is button 
 two line text" />


在按钮标记的价值属性拆分文本
希望对你有帮助..