October 22, 2011

Controlling the Vertical and Horizontal space using HTML

If some text wraps around an image, it may look like too close to the image. We can increase the vertical and horizontal space around the image using the vspace and hspace attribute of the <img> tag, see the next image.

<html>
<head>
<title>Images</title>
</head>
<body>

Texts above the image.<br />
<a href="header.html"><img src="images/pix.jpg" alt=”pix"
vspace="15" hspace="15" align="middle"/></a>Texts on the 
right of the image<br /> Texts below the image.

</body>
</html>

The code will be rendered this way:

A preview of an image without the horizontal and vertical space, see next image.
About the code:
  • The vspace means vertical space is an attribute of <img> tag used to increase the vertical space above and below the image, in our example the vertical space is increased by 15 pixels.
  • The hspace means horizontal space is an attribute of <img> tag used to increase the horizontal space to the left and right of the image, in our example the space to the left and right of the image is increased by 15 pixels.
tags: ,

0 comments:

Post a Comment

Subscribe to: Post Comments (Atom)