html - CSS/HTML - 断字可以应用于<输入类型 ="submit"值吗？

Question

我正在使用表单发送 POST 数据，看起来像一个链接，因为在我的案例中我看不到另一种可能性。

我显然可以将提交按钮的样式设置为看起来像一个链接，但连字符或断字参数将不适用。一些提交按钮的值文本比周围的 div 容器长，所以我需要连字符。

我什至尝试给特定的输入元素一个 id 或 class，但仍然对 css 没有影响。

有什么想法吗？

#box_link
{
width: 100px;
height: 100px;
background-color: lime;
}

#box_link input[type=submit]
{
  background-color: white;
  margin: 0;
  padding: 0;
  border: 0;

  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}

#hyphbutton
{
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}

#box_link input[type=submit]:hover
{
  color: red;
}

<div id="box_link">

<form action="alarmierungssoftware/anwendungsbeispiele" method="POST">
<input type="hidden" name="param" value="stiller_alarm" />
<input type="submit" id="hyphbutton" value="Stiller Alarm / Hilferuf" />
</form>

</div>

Answer 1

使用 <button>元素而不是 <input> .不需要断字规则:没有特别长的单词，文本可以在空格处换行。

#box_link
{
width: 100px;
height: 100px;
background-color: lime;
}

#box_link [type=submit]
{
  background-color: white;
  margin: 0;
  padding: 0;
  border: 0;
}

#box_link [type=submit]:hover
{
  color: red;
}

<div id="box_link">

<form action="alarmierungssoftware/anwendungsbeispiele" method="POST">
<input type="hidden" name="param" value="stiller_alarm" />
<button type="submit" id="hyphbutton" value="Stiller Alarm / Hilferuf">Stiller Alarm / Hilferuf</button>
</form>

</div>