html - 为较新版本的 chrome 创建带有两行文本的输入类型 ="button"

标签 html css

如果有人能解释原因,我会接受“不可能”的答案。但是,我不会排除使用 <button> 的答案。因为这不是这个问题要问的。

我正在尝试用两行文字制作一个输入按钮,但较新版本的 chrome 不允许我这样做,这是我尝试过的:

回车分隔符

    <input type="button" value="Line One&#13;&#10;Line Two"/>

    <input type="button" value="Line One\r\nLine Two">

我知道你可以使用 white-space: normal;但这不会让你<br>你想要的地方。

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

有没有办法在我选择的按钮中添加新行?

line one

line two

最佳答案

虽然我无法证明它不可能,但尝试制作 input 并不是一个好主意。按钮占用多行。首先,HTML5 spec关于 value 只说这个属性:

If the element has a value attribute, the button's label must be the value of that attribute

请注意,“按钮的标签”并未在规范中的任何地方定义。这意味着浏览器供应商可以选择如何解释它,也意味着他们可以随意更改解释。

您刚刚见证了 Chrome 团队决定做出这样的改变。它可能会再次发生,也许在另一个浏览器中。因此,您现在找到的任何解决方案都不会是永久性的,并且会受到浏览器供应商突发奇想的影响。

这就是为什么我强烈建议使用 <button>元素。因为规范保证允许您进行 HTML 格式化,例如换行。

关于html - 为较新版本的 chrome 创建带有两行文本的输入类型 ="button",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37800911/

相关文章:

jquery - 显示 div 并使其在悬停时显示 jQuery html

javascript - Flexbox:一旦另一个 flex 元素的宽度为 0,如何包装一个 flex 元素?

css - 如何将 bool 值与 Bootstrap 导航选项卡一起使用?

css - 如何在 Firefox 中隐藏滚动条?

javascript - 无法向此动画中的 Z 添加框阴影或文本阴影

jquery - 如何在浏览器中启用用户名和密码自动填充

javascript - 使用 javascript 克隆整个 html 表(具有唯一 ID)元素

javascript - 无法让 JQuery 附加一些 html 和值

php - 下拉列表在 Firefox 上消失

html - 如何使用动态 Ruby on Rails 创建列?