Scribd
Upload
53 views

Floating CSS

This document contains CSS code to style text and boxes on a web page. Styles are defined for font size, color, text decoration, float, width, height, and background color. The CSS is then applied to div boxes and paragraphs of text on the sample web page to demonstrate styling with CSS.

Uploaded by

Ania Neal
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
53 views

Floating CSS

This document contains CSS code to style text and boxes on a web page. Styles are defined for font size, color, text decoration, float, width, height, and background color. The CSS is then applied to div boxes and paragraphs of text on the sample web page to demonstrate styling with CSS.

Uploaded by

Ania Neal
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

Floating: floating.

html
!
!

<!doctype html>
<html>
<head>
<title>Learning CSS</title>

<meta charset="utf-8" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />

<style type="text/css">

.large {
font-size:200%;
}

#green {
color:green;
}

.underline {
text-decoration:underline;
}

.bold {
font-weight:bold;
}

.purplebox {
background-color:#B404AE;
width:200px;
height:200px;
float:left;
}

.greenbox {
background-color:#295715;
width:300px;
height:100px;
float:right;
}

.floatleft {
float:left;
}

.clear {
clear:both;
}

</style>

</head>

<body>

<div class="purplebox">

<p class="large">This is some text.</p>

</div>

<div class="greenbox">

<p id="green" class="large">This is some more text.</p>

</div>

<div class="clear"></div>

<p class="floatleft">The third <span class="underline large bold">word</
span> in this paragraph is underlined.</p>

</body>
</html>

You might also like