Transparent submit button without the get value of "x" and "y"

[joon1]

I have a webpage at http://dot.kr/x-test/buttonIMG.php.
There are 7 images, I like you see the 5th image carefully.

My main question is that How can I make that the html background color “yellow” is shown and not to have the stupid get value of “x” and “y”?

[RT_]

You have been doing a couple of things wrong here which has lead to the browser trying to guess what you are trying to do. I suggest you take a little time to learn the proper way to use HTML forms. I recommend http://www.amazon.com/Build-Your-Website-Right-Using/dp/0987090852 It was the first book I read on HTML and gives a good foundation on some concepts I think you are missing.

So how to get this to work?

Well first you need to define your input type, which should be text, as your input is just a few words or so.

<input name="key" type="text" />

Next your “maginifying glass button” should be a submit button.

<input value="Search Now!" type="submit" class="searchSubmit" />

To get the visual effect, you should be using CSS, that is what it is for. Ideally this should be linked in the head with an external style sheet.

.searchSubmit {
   height: 80px;
   width: 80px;
   padding: 0;
   margin: 0;
   border-style: none;
   background-image: url(http://dot.kr/x-test/image/buttonIMG.png);
   background-size: 80px 80px;
   background-color: rgba(0,0,0,0);
   color: rgba(0,0,0,0);
   text-size: 0;
}

input[type=text] {
   height: 40px;
   width: 300px;
}

Also you should re-size your image to 80px by 80px, otherwise it’s just wasteful.