set Aligning Images in html from css
<!DOCTYPE html><html>
<head>
<title>Aligning Images</title>
<style type="text/css">
body {
font-family: Georgia, "Times New Roman", serif;
color: #665544;}
img.align-left {
float: left;
margin-right: 10px;}
img.align-right {
float: right;
margin-left: 10px;}
img.medium {
width: 250px;
height: 250px;}
</style>
</head>
<body>
<p><img src="images/magnolia-medium.jpg" alt="Magnolia" class="align-left medium" /><b><i>Magnolia</i></b> is a large genus that contains over 200 flowering plant species. It is named after French botanist Pierre Magnol and, having evolved before bees appeared, the flowers were developed to encourage pollination by beetle.</p>
<p><img src="images/magnolia-medium.jpg" alt="Magnolia" class="align-right medium" />Some magnolias, such as <i>Magnolia stellata</i> and <i>Magnolia soulangeana</i>, flower quite early in the spring before the leaves open. Others flower in late spring or early summer, such as <i>Magnolia grandiflora</i>.</p>
</body>
</html>
output:
0 comments:
Post a Comment