如何设置样式提交按钮?

use*_*362 6 html css css3

如何设置提交表单按钮的样式?这是可能的,或者我应该使用图片(png)?我的意思是这样的:

在此输入图像描述

Moh*_*qui 13

那么,你应该首先了解CSS或层叠样式表.它们用于设计我们的网页样式.使用CSS可以设置按钮的样式.

仅供参考:

什么是CSS?

  • CSS代表Cascading Style Sheets
  • 样式定义如何显示HTML元素
  • 样式被添加到HTML 4.0以解决问题
  • 外部样式表可以节省大量的工作
  • 外部样式表存储在CSS文件中

您可以像这样设置按钮的样式:

input[type=submit] {
    border-radius: 5px;
    border: 0;
    width: 80px;
    height:25px;
    font-family: Tahoma;
    background: #f4f4f4;
    /* Old browsers */
    background: -moz-linear-gradient(top, #f4f4f4 1%, #ededed 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, #f4f4f4), color-stop(100%, #ededed));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #f4f4f4 1%, #ededed 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #f4f4f4 1%, #ededed 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #f4f4f4 1%, #ededed 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #f4f4f4 1%, #ededed 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4f4f4', endColorstr='#ededed', GradientType=0);
    /* IE6-9 */
}
Run Code Online (Sandbox Code Playgroud)

http://jsfiddle.net/mareebsiddiqui/jGVa3/1


Muj*_*aFR 5

您可以使用 css 来完成...在您应该添加的 HTML 页面中

<input type="submit" value="Send"/>
Run Code Online (Sandbox Code Playgroud)

然后,您需要将此文本添加到另一个 css 文件中的同一个 HTML 文件中。

<style>
input[type="submit"]{
    /* change these properties to whatever you want */
    background-color: #555;
    color: #fff;
    border-radius: 10px;
}
</style>
Run Code Online (Sandbox Code Playgroud)

希望能帮到你