Text and style |
|
HTML elements |
|
The required elements in an html web page are:
Other elements we have seen:
Two more elements:
|
|
Containers |
|
The contents of the body element are the things that actually appear in the web page. The contents of the head element are just used in managing the page. The required elements in an html web page are:
Other elements:
Two more elements:
|
|
Block and in-line containers |
|
The containers in the body are either block containers or in-line containers. Block containers:
In-line containers:
RULE 1: block containers cannot be put inside in-line containers. |
|
Containers with style |
|
You can use external style sheets, an internal style element, and a style attribute to give style to a container. The style for a container will affect some things within the container.
The sample shows the four containers we are using in the body. |
|
id and class |
|
Sometimes we wish to give an element a unique id.
We can do this with the
Sometimes we wish to give several elements the same class name.
We can do this with the
|
|
space |
|
No matter how many spaces you type between words, you only get one space when you see the web page.
If you want an extra space, you can use the special character
nbsp stands for
Example: |
|
text-indent style |
|
In some printed and written material, the first line is indented, to show the beginning of a paragraph. In web pages, this is sometimes done, and sometimes not. That is because the p element generates a blank line before the beginning of the paragraph, which shows the beginning of the paragraph.
indents can be provided at the beginning of each paragraph with the |
|
br and hr |
|
Two simple elements are
|
|
Preformatted text |
|
There are many html elements and css rules that help us specify the format for our pages. Almost always we will use them to control the way our pages are displayed.
Occasionally you may wish to take control of exactly how the text is spaced on the page.
I use this to display the source code for samples.
If you do this, you must be careful to make sure the lines are not too long.
Long lines can cause various problems.
If you need to do this, use the |
|
Quotes |
|
A short quote is one word to a couple of lines long.
Occasionally you will see a long quotation in a book.
The sample shows |
|
Box model |
|
The box model is very important.
|
|
Box side |
|
You can specify the style for one or more of the sides of the box. |
|
Align |
|
The text-align property can be used to align text to the left, right, center,
or to justify the text. There is also a vertical-align property. It aligns things with respect to the line of text. Values include baseline, middle, sub, super, text-top, text-bottom, top, and bottom. |
|
Lab 4 |
|
Now you are ready to build your lab 4 web page. |
|
Put your web page on the Internet |
|
Upload your revised |
|
Complete Lab 4 |
|
You have built your lab 4 web page and uploaded it to voyager.
|
|
Reading assignment |
|
Read information that your find relivant from the book you selected. |
|