An element can be floated to the left of a Web Page by assigning a left value to the float property. Let's create a webpage , named floatleft.html, to understand how an element is floated to the left of the Web Page.
<!DOCTYPE html>
<head><style type="text/css">
.fool {
float:left;
}
</style>
</head>
<body>
<h1>Floating an element to the left </h1>
<p>
<img class="fool" src="car.jpg"/>
My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.
</p>
</body>
</html>
The output of the above Web page is:
<!DOCTYPE html>
<head><style type="text/css">
.fool {
float:left;
}
</style>
</head>
<body>
<h1>Floating an element to the left </h1>
<p>
<img class="fool" src="car.jpg"/>
My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.My paragraph.
</p>
</body>
</html>
The output of the above Web page is:
welcome sir
ReplyDelete