Samples of HTML codes
- To play with this file, use your browser's "View Source" menu item, save the
source file, then open it with BBEdit or Qedit or any other editor you
please. You can change it any way you like, and then use the browser's
"Open File" menu item to see what it looks like with the changes.
- (If you think about it long enough, it might occur to you that the
browser is supposed to interpret the
"<" and the ">", instead of printing them like this.
The comments in this file -- which you can view with View Source -- give instructions on how to make this happen,
among other tricks.)
(Note:
Multiple spaces and
multiple
lines
in the source file
are ignored.)
Examples of
various type
sizes:
This is <H1>
This is <H2>
This is <H3>
This is <H4>
Now we're back to ordinary-size type. All type can be made
italic,
boldface, or
boldface italic.
The marker <b> or <B> starts boldface, and
the marker </b> or </B> ends it.
The marker <i> or <I> starts italic, and
</i> or </I> ends it.
Use both together: <i><b> to do bold italic;
and close both (in either order) </b></I> to
end it.
(This all assumes you know why you'd want to use either
one, of course;
knowing how to use HTML is not a substitute for knowing how to
write.)
HTML is very handy for making lists. There are several types:
This is an "ordered list", using numbers.
- The HTML marker to begin an ordered list is <OL>
- Unsurprisingly, the marker to end it is </ol>
- Each numbered item starts with <li> (for "List Item")
- You don't have to put in the number
- Not only that, you can't change it. Numbering is automatic.
This is an "unordered list", using "bullets".
- The HTML marker to begin an UNordered list is <UL>
- The marker to end it is </ul>
- Each "bullet point" also starts with <li>
There is also a "Directory List", which is useful for defining terms, and
various other situations where you might want two levels of indentation.
- The HTML marker to begin a Directory list is <DL>
- ... and it ends with </dl>
- There are two types of item codes:
- <DT>, which stands for "Directory Term"
- <DD>, which stands for "Directory Definition"
- Note that a Directory list doesn't look like a list;
- <DT> skips a line, but doesn't indent, and doesn't make a blank line, while
- <DD> skips a line and indents; if you happen to have
a very long line (like this one) that would wrap around, the new line is
lined up indented.
- The <DD> mark was intended to be a "definition" of the
term,
- but it's good for lots of other things.
- Netscape's "Bookmark" list is an HTML file, formatted using
<DL>;
- most of the "Hot List" pages on the Web started off
being bookmark files.
- There is no automatic "bullet" with list items in a Directory List, but
- if you want a bullet to appear, you can use <li>
after <dt>, like this
- or after <dd>, like this
- But ... this is what happens if you put <LI>
before <DT>
- and this is what happens with <LI> before
<DD>, so be CAREFUL.
All kinds of lists start and end with implicit Paragraph marks.
All of the marks above are just text formatting commands -- the sort
of thing any wordprocessor does; but the real power of HTML, and the Web
generally, lies in HyperText, that is, the ability to link one
page to another so that it becomes a "hot link". These are the blue,
underlined text pieces that you click on. They're called "anchors" in
HTML, and they use the <A ...> ... </A> marker.
A link like the following one to my home page: John Lawler
looks like this in HTML:
<A href="http://www.umich.edu/~jlawler/">John Lawler</A>
This consists of the following parts:
- It begins with the mark "<A", followed by at least one
space or blank line,
- followed by "href" (for "Hypertext REFerence"), with NO
spaces,
- followed by "=" (the "equal sign"), with NO spaces,
- followed by the URL typed out, surrounded with DOUBLE quotes, and NO spaces,
- and terminated with ">", and NO spaces,
- followed by whatever text you want to be blue and underlined
(i.e, the link name itself; this can be as long as you want and can
have spaces in it),
- and ending with the mark </A>.
Any URL can be linked this way. Clicking on it will go to that page,
just as if you had typed it into Netscape, or "opened" it from a menu.
Back to the Linguistics 114 home page
The URL of this page is: http://www.umich.edu/~jlawler/html.sample.html
Last change 2/19/01
John Lawler