Wednesday, November 3, 2010

HTML Lessons (Basic) 6-10

(6) Next on the agenda are HTML ATTRIBUTES.
- These guys provide additional info about ELEMENTS.
- They are always specified in the START TAG - and they should always be enclosed in quotes (" ") ... when attribute value itself contains quotes, the attribute should be single quotes.
- They come in name/value pairs: name="value"
* HTML links are defined with the "a" tag, and the address is specified in the "href" attribute.
- They should be written in lowercase.
* They offer a complete list of legal attributes - which is not short! - and the top four standard attributes:
class (classname): specifies classname
id (id): specifies unique id
style (style_definition): specifies inline style
title (tooltip_text): specifies extra info about an element

(7) Then we have HEADINGS...
* headings are delineated from 'h1' (largest heading) to 'h6' (smallest leading) tags
* Interesting Fact! Browsers automatically add an extra line before and after a heading
* Browsers use headings to index the structure and content of a page
* The "hr /" element creates a horizontal line - it can be used to separate content
* An HTML comment can be inserted in your HTML to make it more readable...it doesn't show up in the browser. It looks like this: "!-- This is a comment --"

(8) And PARAGRAPHS...
* These guys are denoted as the "p" and "/p" tag
* The "br /" tag denotes a line break within a paragraph
* Interesting Fact! Putting spaces and lines in yourself will not stick in HTML...just by using the space bar or return key won't cut it when it loads in a browser

(9) Then there is FORMATTING...
* This chapter outlines the basic formatting tags
* Interesting Fact! "em" and "strong" means you want that section to be IMPORTANT, but it often comes up as italic and bold respectively...important to know that they may sometimes show up as even different, like cursive (in other words, they aren't synonymous with italic and bold
* "pre" means preformated text - it preserves line breaks and spaces...
* Computer output tags include: (1) "code" = Computer Code (2) "kbd" = Keyboard Input (3) "tt" = Teletype Text (4) "samp" = Sample Text (5) "var" = Computer Variable
* "address" notes the contact information of the owner of the HTML document
* "abbr= "..."" (abbreviation) and "acronym= "..."" (acronym) symbols are used to show the spelled-out version when the mouse is held over the abbreviation or acronym
* "bdo dir="rtl"" shows the direction of the text to be "right to left"
* Quotations... (1) "blockquote" - these are used for long quotations and add margins and spaces (2) "q" - these are used for short quotations and automatically add quote marks
* Deleted text - "del" (which puts a strikethrough the text) / inserted text - "ins" (which underlines the inserted text)
*** The chapter then runs through the basic formatting tags

(10) Finally STYLES...
* Here are some style examples...within the tag, you add style="STYLE TAG" ...
(1) background-colour: (2) font-family: (3) font-size: (4) color: (5) text-align: