HTML button image



If the HTML preset buttons cannot meet your page needs, in addition to using CSS syntax to make some border or color changes, you can also use images to decorate them, of course, if you can add some CSS syntax Retouching may look better.


Picture button example 1. Pure HTML button image

<button type="button"><img src="Image URL"></button>



In the first example, the original HTML <button> tag is used, and the image is wrapped in it, and the result is shown as above.


Picture button example 2: Designed through CSS syntax

<input type="button" style="background-image:url(Image URL);width:80px;height:25px;">



After the second example is modified with CSS, can the button and image be more integrated and then together? Background-image is used to specify background images in CSS syntax. Our sample image specifications are 80px in length and 25px in width, so the length and width are written in the style together, the rendering effect is more beautiful than the pure HTML design.

Post a Comment

0 Comments