How to implement css button background image? (code example)

云罗郡主
Release: 2018-10-29 15:55:15
forward
6048 people have browsed it

How to implement css button background image? I believe that many friends who have just come into contact with CSS will have such questions. This chapter will introduce to you how to implement css button background images. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

How to implement css button background image? (code example)

Many people like to use a picture as a submit button when submitting a form. Most people may use JS to operate the form submission, that is, when the user clicks on the picture, it will respond. A JS to submit the form. In fact, there is another way, which is to directly set the image background of the SUBMIT button. There are two ways to set its image background. One is to set it directly in the button, as follows:

<input type="submit" name="submit_button" value="" style="background:url(imagepath) no-repeat" />
Copy after login

This setting method is visible under FF, but not under IE. I don’t know why. Anyway, it was not visible under IE when I tested it. It won’t work if I change it to this: background-image\backgroundimage;

Another method is to use CSS to set it. The implementation method is as follows:

<style type="text/css">
    .submitStyle {background:url(imagpath);border:0px}
</style>
Copy after login

The above is a complete introduction to how to implement the css button background image. If you want to know more about CSS3 video tutorial, please pay attention to the PHP Chinese website.


The above is the detailed content of How to implement css button background image? (code example). For more information, please follow other related articles on the PHP Chinese website!

source:lvyestudy.com
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template