| Back to home page |
| Tag Type | Tag | Attribute | Value | Used for... |
|---|---|---|---|---|
| Doc statement | !DOCTYPE | Indicating the version of HTML used. URL for the DTD reference is for web page standards verification. | ||
| Basic code | html /html |
none | none | Basic code for any page, indicates the begining and end of an html document. |
| head /head |
none | none | Basic code for combining with the Title tag and other header information. | |
| title /title |
none | none | Basic code for placing a title in the browser title bar. | |
| body /body |
link="" | Hex number or color name | Basic code for indicating the begining and end of the body an HTML document. This will be the actual web page with text, tables, images, etc.
The link, vlink, and alink attributes will change the colors of the hyperlinks, visted hyperlinks, and active hyperlinks respectively. The bgcolor attribute will set the color of the background to the selected color. The backbround attribute will use an image for the background. The value will be the image name or folder path name if it is not in the same folder as the html file. Also note, an image will tile indefinitely on the page, so it's best to use images that do not have a central object and any two opposing border pixels match each other in color. Also, if you avoid using these attributes to the body tag, the website will be at the mercy of the browser default or user settings. |
|
| vlink="" | Hex number or color name | |||
| alink="" | Hex number or color name | |||
| bgcolor | Hex number or color name | |||
| background="" | Image file name | |||
| Text | hn /hn |
n | interger from 1-6 | Makes text larger and bold for a heading in the body.
Repalce the n with a 1 to 6 to change the text size. 1 is the largest, 6 is the smallest. The align tag is for setting the justification to the left, right, or center. |
| align="" | left, right, or center | |||
| font /font |
color="" | Hex number or color name | This is for changing the font style. The color can be changed with the color tag and the hex number or name of a color.
The face attribute is for changing the font style, using the name of the font. The size attribute changes the font size to a specific size with 1 to 7, where 7 is the largest, or to a relative size using -3 to +4. This is another tag which without it, the web page is at the mercy of the browser's default settings. And if the viewer doesn't even have the font face you set, well, it won't do much good. |
|
| face="" | Font name | |||
| size="" | interger from 1 to 7, interger from -3 to +4 |
|||
| b /b |
none | none | Text encased in tags will appear bold. This is a phsyical tag. | |
| i /i |
none | none | Text encased in tags will appear italics. This is a physical tag. | |
| u /u |
none | none | Text encased in tags will appear underlined. This is a phsyical tag. | |
| strong /strong |
none | none | Text encased in tags will appear different based on the text around it, usually bold. This is a logical tag. | |
| em /em |
none | none | Text encased in tags will appear different based on the text around it, usually italics. This is a logical tag. | |
| big /big |
none | none | Text encased in tags will appear larger than the text around it. This is a logical tag. | |
| small /small |
none | none | Text encased in tags will appear appear smaller than the text around it. This is logical tag. | |
| blockquote /blockquote |
none | none | Text encased in tags will appear like this, with indentations and extra spacing on the sides. |
|
| pre /pre |
none | none | Text encased in tags will appear as if it were typed into a text eiditor instead of how a web page formats the page. For example, I haven't used a br / or /p tag here. |
|
| sub /sub |
none | none | Text encased in tags will appear as subscript. | |
| sup /sup |
none | none | Text encased in tags will appear superscript. | |
| tt /tt |
none | none | Text encased in tags will appear with each character monospaced. | |
| Spacing | p /p |
align="" | left, right, center | Sets text apart as a paragraph, putting space above the first line. |
| br / | clear="" | left, right, all, or none | Inserts a line break without spacing. A clear attribute is needed to stop text wrapping. The clear attribute will cause the next empty margin area to be the target of the br / tag, so that way text wrapping will stop. | |
| hr / | size="" | interger | Adds a horizontal rule across the page. This will follow text wrapping unless cleared. The thickness of the rule can be increased by using a higher value for the size. | |
| Lists | ul /ul |
type="" | disc, square, or circle | Indicates the begining and end of an ulordered list which uses symbols for the list items. The default bullet is the disc, but you can specify the disc, square, or circle with the type attrivute. |
| ol /ol |
type="" | A, a, I, i, or 1 | Indicates the begining and end of an ordered list which uses numbers, letters, or Roman numerals for list items. | |
| li /li |
value="" | value1 | Indicates a list item with an ordered or unordered list. The value attribute restarts the list count to 1. | |
| dl /dl |
none | none | Indicates the begining and end of a definition list. This is made to format the listed items like a dictionary. | |
| dt /dt |
none | none | List item will be displayed as a term. The definition will be indented on the line below it. | |
| dd /dd |
none | none | The term's definition | |
| Images | img / | src="" | Source locations of the image. | Sets a section of the web page for displaying an image. The src tag is the most important, it tells the browser were to find the file. It can be the file name only if the image is in the same folder as the html file, or else it must include folder names in a path
The align tag tells the image where to be positioned on the page, and where test will wrap around it. The alt tag will show the text entered if the image does not load for any reason in the browser. The height and width are not needed, but help the browser know how much space to set up for the image The border tag will create a picture frame like border around the image at the desire size if greater than 0. The hspace and vspace tags will set up space around the image to help keep other things like text from displaying right up against the image. |
| align="" | bottom, middle, top, left, or right | |||
| alt="" | text | |||
| height="" | Positive interger | |||
| width="" | Positive interger | |||
| border="" | Positive interger | |||
| hspace="" | Positive interger | |||
| vspace="" | Positive interger | |||
| Anchors | a /a |
href="" | Name of another html file, with the necessary path name. Also used for e-mail links. | The anchor tag is used for linking web sites together, or quickly jumping to another place within a web page. The href tag is needed for any link to connect to another place. It will be the file name and necessary path to reach the file. It can be use for e-mail as well, by using "mailto:email@isp.com" as an example, as the attribute of the href tag. Also it can link to a name attribute anchor, for example href"#top" would take you to an a tag with the name="top" attribute. And to make a link clickable, you must put text or an image between the a and /a tags.
The rel and rev tags are sequential markers used with href, usually placed before the href attribute. To mark a page as following the current page, use rel. To mark a page as prior to the current page, use rev. Finall, type is used to let a browser know what is in the next web page so it can predict if it can handle the content. And example would be "text/javascript". |
| name="" | "top" for example | |||
| rel="" | next | |||
| rev="" | prev | |||
| type="" | File type | |||
| Tables | table /table |
align="" | left, right, center | This table tag sets the begining and end of a table. It also has many formatting attributes.
The table can be aligned using the align attribute with the table tag. The entire table can have the same background color using the bgcolor tag here. The default border is no border. To have a border, the value must be 1 or higher. The cellspacing attribute will increase the space between each cell by the number of pixels equal to the value. The cellpadding attribute will add space to the inside of the cell, keeping the contents away from the cell walls. This is a number of pixels equal to the value. The cols attribute tells the table how many columns it will have. The width attribute will tell the browser how wide to make the table, in pixels or percentage of the browser window size. |
| bgcolor="" | Hex number or color name | |||
| border="" | Positive interger | |||
| cellspacing="" | Positive interger | |||
| cellpadding="" | Positive interger | |||
| cols="" | Positive interger | |||
| width="" | Positive interger or percentage | |||
| tr /tr |
align="" | left, right, center, justify | This is the table row tag. It creates a row, and its attributes control the entire row, but nothing else.
The align attribute is to justify the text within the cells. The bgcolor tag is for the row color The valign attribute is for vertical alignments within the cells. |
|
| bgcolor="" | Hex number or color name | |||
| valign="" | top, middle, or bottom | |||
| th /th td /td |
align="" | left, right, center, or justify | The th tag is for cell headings. They are normally center aligned and bold by default. The td tag is for a normal cell. It's default is left justify and the current text size. Attributes used here only affect one cell, in a manner of speaking. The colspan and rowspan expand the cell into other columns and/or rows.
The align attribute will align the text in the specific cell. The bgcolor attricute is the one cell's color only. The colspan will make a cell cross over columns. Good for cells that have data shared in two or more adjacent columns. The rowspan attribute will make the cell expand down through two or more rows. Good for a heading to the row about data that is similar for the rows involved. The valign attribute is for vertical alignment of the one cell. |
|
| bgcolor="" | Hex number or color name | |||
| colspan="" | Positive interger | |||
| rowspan="" | Positive interger | |||
| valign="" | top, middle, or bottom | |||
| caption /caption |
align="" | top, bottom, left, or right | This will place a caption by the table, aligned on the value. |