When you use an HTML tag for paragraphs, headings, or lists, those tags affect that block of text as a whole, changing the font, changing the spacing above and below the line, or adding characters (in the case of bulleted lists). Character styles are tags that affect words or characters within other HTML entities and change the appearance of that text so it is somehow different from the surrounding text - making it bold or underlined, for instance.
To change the appearance of a set of characters within text, you can use one of two kinds of tags: logical styles or physical styles.
Logical style tags indicate how the given text is to be used, not how it is to be displayed (emphasis, citation, definition). The displaying browser determines how the final display will look. All that you can guarantee is that this text will some how be different than the rest of the text on the page. Here are 8 logical tags:
We'd all get along much better if you'd stop being so silly
You must open the can before drinking
#include "trans.h"
The URL for that page is http://www.cern.ch/
Type the following command: find . -name "prune" -print
chown your_name the_file
Styles that are named after how they are actually used are called logical character styles
Eggplant has been known to cause nausea in many unsuspecting people (Lemay, 1994)
You may also nest charater tags-for example you may use both Bold and Italic together like this:
This is Bold Italic
Normally an HTML browser stripes off extra blank spaces, tabs, returns, etc.. that are in the document. Using the <PRE> and </PRE> retains the formatting around text. The catch is that the text is presented in in monospaced Courier font. You can use tags such as anchors, links, and character styles, but not element tags like headings and paragraphs. Here is an example:
Unit Distance Destination ---------------------------------- Miles 125 Chicago Km 300 Detroit
When writing the code, remember that the space used by the tags is ignored. Here is the code:
<PRE> Unit Distance <I>Destination</I> ---------------------------------- Miles 125 Chicago Km <B>300</B> Detroit </PRE>
Notice how the characters in the code do not line up as they do in the final displayed text due to the tags.
The <HR> tag (no closing tag) creats a horizontal line across the page.
The extensions for the <HR>. tage are WIDTH, ALIGN, SIZE and NOSHADE. Here is a table of <HR>'s attributes. Notice that when they are invoked from within a table, they use the tables left margin as the left hand starting point. The first 3 codes are repeated after the table to demonstrate the difference.
<HR WIDTH=10%><HR WIDTH=50%><HR WIDTH=100%><HR WIDTH=10 ALIGN=LEFT><HR WIDTH=200 ALIGN=LEFT><HR WIDTH=500 ALIGN=LEFT><HR ALIGN=LEFT WIDTH=50%><HR ALIGN=CENTER WIDTH=50%><HR ALIGN=RIGHT WIDTH=50%><HR SIZE=2>(Note that 2 is the smallest size
allowed.<HR SIZE=6><HR SIZE=15><HR SIZE=16 WIDTH=70% ALIGN=CENTER NOSHADE>
The <BR> tag breaks a line of text at it's location. When a browser
encounters a <BR> tag it starts the following text at the left side of
the following line. It does not add additional spacing. If used in a table,
text resumes at the left edge of the table.
Here are two examples
followed by there code:
I am
using
to many
Break tags!
<P>I am <BR> using <BR> to many <BR> Break tags!</P>
A table:
The Address tag <ADDRESS> is used for signature-like entities on web pages. They usually go at the bottom of a web page. Here is an example:
[email protected] Donald R PainterThe <BLOCKQUOTE> tag is used to create quotations. You may use <BR> tags in it for formatting. For example:
Thunder roared
Lightening flashed
A tree fell
A frog got smashed.
The code:
<BLOCKQUOTE> Thunder roared<BR> Lightening flashed<BR> A tree fell<BR> A frog got smashed. </BLOCKQUOTE>
Characters in HTML files must be from the standard (7-bit) ASCII character set, and cannot include any characters from "extended" (8-bit) ASCII, as every platform has a different definition of the characters that are included in the upper range. HTML browsers interpret codes from upper ASCII as characters in the ISO-Latin-1 (ISO-8859-1) character set, a superset of ASCII.
To make special characters, you must put codes into your page. Here is a list of codes:
Entity Result Note ------ ------ ----------- < < > > & & " " « « © © copyright ® ® registered trademark ´ ´ example: resumé Code: resumé A blank space & & & & &
Under HTML 3.2 text can be aligned as LEFT, CENTER, or RIGHT justified. Here are examples of each:
<H3 ALIGN=LEFT>This is aligned LEFT</H3>If you have several lines that you want justified in the same way, you can use <DIV> to do them all at once. Just put <DIV> ahead of them and </DIV> at the end of the group like this:
The code looks like this:
<DIV ALIGN=CENTER>
<H2> This is the first line</H2>
<H3> This is the second line</H3>
<H3> This is the last line</H3>
</DIV>
The <FONT> tag was originally used to control the font size of the characters that it surrounded. It has since been expanded to include changing the font itself as well as the color of the font.
Values for the font SIZE attribute are 1 thru 7. 1 being the smallest, 3 the default, and 7 the largest. Here are examples:
Font = 1 , Font = 2 , Font = 3 , Font = 4 , Font = 5 , Font = 6 ,<FONT SIZE=1>Font = 1 ,</FONT> <FONT SIZE=2>Font = 2 ,</FONT>
etc...
Font size can also be used to change the spacing of a blank
line between to blocks of text. The space below was put there by setting
the FONT SIZE=7 and using the <BR> tag.
The FACE attribute gets a list of font faces. The browser starts at the front of the list and looks for that font. It it can not find the first font it searches for the second and so on until it either finds one of the requested fonts or it defaults to the default system font.
<FONT FACE="Futura,Helvetica">Futura is my first choice, Helvetica is my second.</FONT>
Futura is my first choice, Helvetica is my second.
This is truely the mark of a poor web page. Anyone using it should be
shot before he or she is allowed to reproduce and pollute our gene pool.
Having said that, here it is:
Never use the <BLINK>BLINK</BLINK> command!
Never use the command!
To change the type of "bullets" that a browser uses while displaying lists, you can use the TYPE attribute. The attribute is put within the opening tag for the list: <UL TYPE=I> for Roman numerals. Here is a table and an example:
<NOBR> ... </NOBR> are tags that force everything between them to be displayed on a single line, even if the line becomes wider than the display screen. <WBR> is used to tell the browser where to break a line at. However, if the line will fit on the display without breaking, the browser will ignore the <WBR> tag.