Question

有人可以建议默认输入/提交按钮的CSS样式吗？我需要用css模仿默认的输入/提交按钮。默认按钮是一个，在HTML中指定input type =“button”后，浏览器会创建该按钮。我需要在href中使用看起来像默认输入/提交按钮的按钮，但在HTML5中使用href内部的按钮是不合法的。所以我想做以下事情：

<a href="#"><span class="button">Input button</span></a>

只需要我的类.button的css，它会创建看起来像默认输入/提交按钮的按钮。

提前谢谢大家。

Answer 1

我希望这对你有用

.button {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.16, rgb(207, 207, 207)), color-stop(0.79, rgb(252, 252, 252)));
  background-image: -moz-linear-gradient(center bottom, rgb(207, 207, 207) 16%, rgb(252, 252, 252) 79%);
  background-image: linear-gradient(to top, rgb(207, 207, 207) 16%, rgb(252, 252, 252) 79%); 
  padding: 3px;
  border: 1px solid #000;
  color: black;
  text-decoration: none;
}

<a class="button" href="somlink.html">button</a>

您需要以不同的方式选择适当的背景图像作为不同的浏览器渲染

修改：为IE10及以上版本添加了background-image: linear-gradient(to top, rgb(207, 207, 207) 16%, rgb(252, 252, 252) 79%);

Answer 2

如果我理解正确，你想做的是;

使用html
使用<a href=#>元素点击该按钮时，该按钮将重定向到另一个页面。

这些是我的想法;

您需要使用位于<button>元素内的<a>元素。 <button>元素将创建一个没有任何CSS的默认按钮。
您可以使用<input>元素并将type属性设置为提交。将它放在<a>元素内，您将拥有可以链接到任何地方的默认按钮。

以下是显示示例的代码。我希望它能解决你的问题。

<!DOCTYPE html>
<html>
<body>

<a href="http://www.google.com"><button>Submit</button></a>

<a href="http://www.google.com"><input type="Submit" value="Submit"></a>

</body>
</html>

Answer 3

使用bootstrap ... http://getbootstrap.com/getting-started/，在此处找到模板https://bootswatch.com/cosmo/

您也可以使用semantic-ui.com。

我希望我能帮助你：D

需要CSS样式用于默认输入/提交按钮

3 个答案: