How can I add three different image button icons in this HTML code?

Question

Here is my HTML code:

<input id="text" type="text" name="text">
<input type="button" name="page1" onclick="javascript:window.open('http://example.com/' + this.name + '/' + document.getElementById('text').value)">
<input type="button" name="page2" onclick="javascript:window.open('http://example.com/' + this.name + '/' + document.getElementById('text').value)">
<input type="button" name="page3" onclick="javascript:window.open('http://example.com/' + this.name + '/' + document.getElementById('text').value)">

Possible duplicate of [HTML / CSS How to add image icon to input type="button"?](https://stackoverflow.com/questions/2920076/html-css-how-to-add-image-icon-to-input-type-button) — ziMtyth, Sep 11 '17 at 07:42
Do you want the buttons to have icons next to a text or that the button is a image? — Dejan.S, Sep 11 '17 at 08:08

FreedomPride · Answer 1 · 2017-09-11T07:58:15.060

0

You just need to add another field as below

<input type="button" style="height:200px;width:200px;background-image:url('https://i.stack.imgur.com/jhiAi.png')"/>

edited Sep 11 '17 at 07:58

answered Sep 11 '17 at 07:14

FreedomPride

1,098
1
7
30

I just tried it. I put /image1.png but not working anymore – SudoGuy Sep 11 '17 at 07:30
@user8481790, you have to define the path of your image. try replace and try this `src="https://i.stack.imgur.com/jhiAi.png"` – FreedomPride Sep 11 '17 at 07:32
@user8481790, also define the height and width in the style. – FreedomPride Sep 11 '17 at 07:42
How to define height and width? – SudoGuy Sep 11 '17 at 07:46
@user8481790, i've attached the jsfiddle has the height and width in the html code. – FreedomPride Sep 11 '17 at 07:53
The fiddle has errors. It has `` – Dejan.S Sep 11 '17 at 07:54

How can I add three different image button icons in this HTML code?

1 Answers1