Week 3 Lecture: Other Attributes and Elements

Div Tags
Other elements can be used to organize your markup. One of the most
common is the div element. You will see it a lot in older code before HTML5
added many more options. It is a basic divider element that can be used for any
element that doesnt have a more specific designation.
You can add attributes to div elements that label it to help you with
organization and formatting. Adding an id or class gives you a way to reference it
later. This will look like <div id=red> or <div class=blue> with a closing tag
of </div> for either of those. A key difference in an id versus a class is that an id
can only be used once and is specific that only that div. A class can be used for
several divs and any formatting you designate to that class will apply to all divs
with that class name.

Heading Tags
Heading tags give you a larger text size and identifies the line as a heading.
This will look like <h1> </h1>. The number in there specifies the level of the
heading. h1 will be larger than h2, which will be larger than h3, etc. Dont
confuse head, header, and heading. Remember that head is a tag you must have at
the top of your page to hold the parts of the page your viewer doesnt see. The
header is the top portion of your page, usually where the logo is and maybe the
menu too. A heading is a line of text that is larger than others, such as an article
title.

Lists
Another useful element is a list. There are two main types, ordered (with
numbers), and unordered (with bullets). You tags <ol>ordered list</ol> or
<ul>unordered list</ul> around each kind. Each item in the list uses <li></li>

tags. The number or bullet is automatically put in according to the type of list you
designated. Another type of list you may use is called a description list. This is
useful for a term and definition list, and this is also what the parts are called. It
uses <dl></dl> tags around the list and inside those you will have
<dt>term</dt> and <dd>definition</dd> for each one.