Textbox Image
This page contains HTML code for background image to an HTML textbox. Feel free to copy and paste this textbox image code into your own website, blog, MySpace page, or other HTML document. And feel free to modify the code as you wish.
Also, please consider keeping the link back to this website - if you do it will be very much appreciated!
Textbox Image Code
To add a background image to your textbox, use the CSS background-image
property. You can also use the background
shorthand property if you prefer.
Here's an example of creating a textbox image, using this image (without the black border):
And here it is as a (repeating) textbox image:
Source Code | Result |
---|---|
No-Repeat Image
In the above example, the background image repeats across the whole textbox, filling up the whole textbox. If you only want the background image to appear once (i.e. not repeat across the textbox), use background-repeat:no-repeat
in the image code. Alternatively, you could just use the background
shorthand property to set both values.
Here's an example using the background
shorthand property:
Source Code | Result |
---|---|
More Background Image Codes
You can do more with your background images, such as specify exactly where it is positioned within your textbox, or set it to just repeat horizontally, etc.
To do stuff like that, check out these repeat image codes and these background image codes. (The codes at those pages can also be used on a textbox image).