html - 你能用 css 设计 html 表单按钮吗？

Question

我不喜欢默认的按钮样式。真的很无聊。我正在使用

<input type="submit">

类型按钮。我可以在 css 中以某种方式设置这些样式吗？如果没有，我想另一种方法是改用 div，并使其成为链接。你如何使这些与表单一起工作？

Answer 1

您可以通过 CSS 轻松实现您的期望:-

HTML

<input type="submit" name="submit" value="Submit Application" id="submit" />

CSS

#submit {
    background-color: #ccc;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius:6px;
    color: #fff;
    font-family: 'Oswald';
    font-size: 20px;
    text-decoration: none;
    cursor: pointer;
    border:none;
}



#submit:hover {
    border: none;
    background:red;
    box-shadow: 0px 0px 1px #777;
}

DEMO