<DIV ...>
<DIV ...>, a block-level element, simply defines a block of content in the page. Beyond defining a block, <DIV ...> itself doesn't do anything.
For example, the following code creates a <DIV ...> element with two paragraphs inside of it. Notice that you can put <P ...> elements inside a <DIV ...>.
This is stuff before the <NOBR><CODE><DIV ...></CODE></NOBR>.
<DIV>
This is stuff inside the <NOBR><CODE><DIV ...></CODE></NOBR>.
<P>
This is more stuff inside the <NOBR><CODE><DIV ...></CODE></NOBR>.
</DIV>
This is stuff after the <NOBR><CODE><DIV ...></CODE></NOBR>.
which gives us:
This is stuff before the <DIV ...>.
This is stuff inside the
<DIV ...>.
This is more stuff inside the <DIV ...>.
This is stuff after the
<DIV ...>.
Because <DIV ...> is a block level element, visual browsers (e.g. MSIE and Netscape) render <DIV ...> elements with a line break before and after them. However, they don't usually put a full blank line before and after like a <P ...> element.
<DIV ...> is usually used in conjunction with styles of the
ALIGN attribute to set some kind of effect for the content. For example, suppose you want a block of the page to be use a different font,
font color, and be indented. To do this, first put some styles rules in the <HEAD> section of the document:
<STYLE TYPE="text/css">
<!--
.warning
{
font-family:sans-serif;
color:red;
padding-left: 50pt;
padding-right: 50pt;
}
-->
</STYLE>
These styles rules create a styles class named
warning. You can then apply the class to a <DIV ...> element using the CLASS attribute:
<DIV CLASS="warning">
contents of DIV element
</DIV>
which gives us this:
WARNING: Do not look directly into the light or it will suck you in like a flea. We're dealing with big ugly powerful forces here, pal, so don't go trying that macho man stuff. Put your super-block-em sunglasses on and keep your eyes on the accountant.
In the next page we'll look at setting the alignment of the element.
