<< .. Go to : : Home : : Exercise 1 : : Demo 1A : : Demo 1B : : Demo 1C : : Demo 1D : : Demo 1E : : TAGS : : All Class Demos .. >>

Exercise 1 Demo: Part C : Group Elements

This is the HTML code you will need for Part C of Exercise 1.

Group Elements can contain several Block Elements. You can use them to break your page content into "groups" of content. You can add styles or attributes to the opening group element and all the content will pick up those styles. Or they will use the default styling if the group element has one.

<!DOCTYPE html>

<html>
<head>
<title>
My First Web Page </title>
</head>

<body>

This part of the demo covers using an elements to group content. Use the DIV element to group your content. Enclose content you want grouped inside a pair of these tags and see what you can make happen. It can be a single piece of content, a paragraph or whole sections of your page.

The div element is the most often used group element. We can add attributes to the opening tag and all the content will pick up the style of the attribute. In my example I used the align attribute with the value of right, so all the content inside the DIV aligned to the right.

<div align="right">

<h3>Using the DIV element </h3>

<p>We added an attribute to our DIV element telling it we want all our content aligned to the right. It will take the whole group or content we choose and do just that. Make it go to the right of our page. </p>

<p>We can group as much content as we want with this tag. Even add in pictures. But that comes later. Be sure to try different alignments and different groups when you use your div tags. </p>

</div>


Always close your HTML documents correctly, using the tags below.

Remember, no content is ever included after you close these tags!!!!

</body>

</html>

Go to Part D of Demo 1.

Back to Part B of Demo 1.

Back to Part A of Demo 1.

© Claudia Faulk. Created in 2008. Updated 6.18