你能用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

Answer 2

是的,这很简单:

input[type="submit"]{
  background: #fff;
  border: 1px solid #000;
  text-shadow: 1px 1px 1px #000;
}

我建议给它一个ID或一个类,以便你可以更容易地定位它.