What is the style of the submit button?

Question

How to create a submit form button? Is this possible or should I use a picture (png)? I mean something like this:

Answer 1

Well, first you need to know about CSS or cascading style sheets. They are used to style our web pages. Using CSS, you can style your button.

For instance only:

What is CSS?

• CSS means cascading style sheets
• Styles determine how to render HTML elements.
• Styles were added in HTML 4.0 to solve the problem.
• External style sheets can save a lot of work.
• Style sheets are stored in CSS files

You can style this button as follows:

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 */ } 

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

Answer 2

 input[type="submit"]{your style here} 

Answer 3

you can do it with css ... In the HTML page you have to add

 <input type="submit" value="Send"/> 

then you need to add this text in the same html file to another css file.

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

Hope this helps you

Answer 4

 try this .button { -moz-border-radius: 25px; -moz-box-shadow: #6E7849 0px 0px 10px; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; -webkit-border-radius: 25px; -webkit-box-shadow: #6E7849 0 0 10px; -webkit-transition: all 0.5s ease; background-color: #6E7849; background-image: -moz-linear-gradient(90deg, #B9C788, #6E7849); background-image: -ms-linear-gradient(90deg, #B9C788, #6E7849); background-image: -o-linear-gradient(90deg, #B9C788, #6E7849); background-image: -webkit-linear-gradient(90deg, #B9C788, #6E7849); background-image: linear-gradient(90deg, #B9C788, #6E7849); border-radius: 25px; border: 2px solid #4a5032; box-shadow: #6E7849 0px 0px 10px; color: #ffffff; display: inline-block; font-size: 4em; margin: auto; padding: 15px; text-decoration: none; text-shadow: #000000 5px 5px 15px; transition: all 0.5s ease; } .button:hover { padding: 15px; } OR try your choice color combination button http://www.cssdrive.com/css3button/ 

Answer 5

Find something called CSS. You can define a class to define font, size, border, radius, etc. For any item

Answer 6

Browsers have a large set of default styles to make everything look beautiful if styles are not defined by the website. For example, Firefox has the following styles defined for the default submit button:

 input[type="submit"] { -moz-appearance: button; -moz-binding: none; -moz-box-sizing: border-box; -moz-user-select: none; background-color: buttonface; border: 2px outset buttonface; color: buttontext; cursor: default; font: -moz-button; line-height: normal; padding: 0 6px; text-align: center; text-shadow: none; white-space: pre; } 

Answer 7

You can do it as follows: -

 input[type="submit"] { /* style code here */ } 

Answer 8

You can style the button as you wish. In the same way as in the previous answers, you can stick your button by selecting it using the input [type = "submit"].

I would advise you to take a look at the following link: http://css3button.net/ here you can automatically generate a button using many CSS3 Properties. According to your cross-viewing requirements, you can also take a look at http://caniuse.com/ to decide whether it makes sense to use these properties. Otherwise, you can use the bg image :-)

Hello