Question

我在html中使用<input type="submit" value="insert"/>作为按钮。但是，如何使这个按钮看起来像一个链接（带下划线的单词），但仍然像按钮一样工作（提交表单）？

Answer 1

这是 FIDDLE

<button type="submit">Submit</button>

button {
  background: none;
  border: none;
  outline: none;
  text-decoration: underline;
  color: blue;
  cursor: pointer;
}
button:hover {
  color: lightblue;
}

或

<input type="submit" value="Submit">

input[type="submit"] {
  background: none;
  border: none;
  outline: none;
  text-decoration: underline;
  color: blue;
  cursor: pointer;
}
input[type="submit"]:hover {
  color: lightblue;
}

Answer 2

只需编辑它的CSS。你可以使用button.id或button #class引用它，并使用常规CSS使它看起来像你想要的CSS规则。

Answer 3

我将此问题标记为重复：Stackoverflow: how-to-make-a-submit-button-display-as-a-link

试试这个：
HTML：

<input type="submit" class="submitLink" value="Submit">

CSS：

.submitLink {
background-color: transparent;
text-decoration: underline;
border: none;
color: blue;
cursor: pointer;
}

JSFiddle

来自：How to make a submit button like a link

Answer 4

的CSS：输入[类型=提交] { 文本装饰：下划线; 边框：无; 背景：无; 显示：内联; 光标：指针; }

如何在HTML中创建表单的提交按钮看起来像一个链接？

4 个答案: