|
|
The input Tip: Always specify both the height and width attributes for images. If height and width are set, the space required for the image is reserved when the page is loaded. Without these attributes, the browser does not know the size of the image, and cannot reserve the appropriate space to it. The effect will be that the page layout will change during loading (while the images load). |
Example of adding height and width Attributes in HTML Input
Define an image as the submit button, with height and width attributes:
index.html
Example:
HTML
<form>
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text" id="lname" name="lname"><br><br>
<input type="image" src="img_submit.gif" alt="Submit" width="48" height="48">
</form>
Output should be:
Full Completed Code example of adding height and width Attributes in HTML Input
The height and width attributes specify the height and width of an input type="image" element.
index.html
Example:
HTML
<!DOCTYPE html>
<html>
<body>
<h1>The input height and width attributes</h1>
<p>The height and width attributes specify the height and width of an input type="image" element.</p>
<form action="/action_page.php">
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text" id="lname" name="lname"><br><br>
<input type="image" src="img_submit.gif" alt="Submit" width="48" height="48">
</form>
<p><b>Note:</b> The input type="image" sends the X and Y coordinates of the click that activated the image button.</p>
</body>
</html>
Output should be:
| Example of adding height and width Attributes in HTML Input | HTML Input Attributes |
| Full Completed Code example of adding height and width Attributes in HTML Input | HTML Input Attributes |
Read Full: | HTML Input Attributes |
Category: | Web Tutorial |
Sub Category: | HTML Input Attributes |
Uploaded: | 1 year ago |
Uploaded by: | Admin |
Views: | 80 |