Create a HTML document to aligning images (Let the image float to the left/right of a paragraph)
Input
<!DOCTYPE html>
<html>
<body>
<h2>Floating Images</h2>
<p><strong>Float the image to the right:</strong></p>
<p>
<img src="nature.jpg" alt="nature" align="right" style="float:right;width:170px;height:170px">
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image.
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image.
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image.
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image.
</p>
<p><strong>Float the image to the left:</strong></p>
<p>
<img src="nature.jpg" alt="nature" align="left" style="float:left;width:170px;height:170px">
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image.
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image.
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image.
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image.
</p>
</body>
</html>
Input
<!DOCTYPE html>
<html>
<body>
<h2>Floating Images</h2>
<p><strong>Float the image to the right:</strong></p>
<p>
<img src="nature.jpg" alt="nature" align="right" style="float:right;width:170px;height:170px">
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image.
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image.
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image.
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image.
</p>
<p><strong>Float the image to the left:</strong></p>
<p>
<img src="nature.jpg" alt="nature" align="left" style="float:left;width:170px;height:170px">
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image.
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image.
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image.
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image.
</p>
</body>
</html>
Output
No comments:
Post a Comment