Basic HTML

1
Basic HTML UCR Webmasters Support Group Derk
Adams
2
What is HTML

• Hyper-Text Markup Language.
• Markup vs. Programming.
• Tags lt gt
• Tag Case.
• White Space.

3
Getting Started

• First Page.
• index.html
• default.htm
• Welcome.html
• Choosing Names.
• Case Sensitivity.

4
Document Tags

• HTML lthtmlgt lt/htmlgt
• Header ltheadgt lt/headgt
• Body ltbodygt lt/bodygt

• lthtmlgt
• ltheadgt
• lt/headgt
• ltbodygt
• lt/bodygt
• lt/htmlgt

5
Header

• Title lttitlegt lt/titlegt
• Metatags.

• JavaScript.
• CSS.

lthtmlgt ltheadgt lttitlegtMy Pagelt/titlegt lt/headgt ltbody
gt lt/bodygt lt/htmlgt
6
Color

• Common names red, blue, green.
• Hexadecimal ff0000, 0000ff, 00ff00.
• Hex counting 0-16 -gt 0-f.
• Color Structure rrggbb 000000

7
Body

• Background Color bgcolor
• Text Color text
• Link Color link
• Visited Link Color vlink

lthtmlgt ltheadgt lttitlegtMy Pagelt/titlegt lt/headgt ltbody
bgcolor000000 textffffffgt This is my first
Page. lt/bodygt lt/htmlgt
8
References

• Absolute Reference
• http//www.ucr.edu/alpha.html
• Relative Reference
• alpha.html

9
Spacing

• Line Break ltbrgt
• Paragraph ltpgtlt/pgt
• Horizontal Rule lthrgt

lthtmlgt ltheadgt lttitlegtMy Pagelt/titlegt lt/headgt ltbody
bgcolor000000 textffffffgt ltpgtThis is my
first Page.lt/pgt lt/bodygt lt/htmlgt
10
Text Formatting

• Bold ltbgt lt/bgt
• Italics ltigt lt/igt
• Center ltcentergt lt/centergt

lthtmlgt ltheadgt lttitlegtMy Pagelt/titlegt lt/headgt ltbody
bgcolor000000 textffffffgt ltpgtltbgtThis is my
first Page.lt/bgtlt/pgt lt/bodygt lt/htmlgt
11
Structure
lth1gtlt/h1gt to lth6gtlt/h6gt
lthtmlgt ltheadgt lttitlegtMy Pagelt/titlegt lt/headgt ltbody
bgcolor000000 textffffffgt lth1gtMy First
Pagelt/h1gt ltpgtltbgtThis is my first
Page.lt/bgtlt/pgt lt/bodygt lt/htmlgt
12
Links
lta hrefgtLink Textlt/agt
lthtmlgt ltheadgt lttitlegtMy Pagelt/titlegt lt/headgt ltbody
bgcolor000000 textffffffgt lth1gtMy First
Pagelt/h1gt ltpgtltbgtThis is my first Page.lt/bgtlt/pgt lta
hrefhttp//www.ucr.edu/alpha.htmlgtMy first
linkltagt lt/bodygt lt/htmlgt
13
Images
ltimg src width height altgt
lthtmlgt ltheadgt lttitlegtMy Pagelt/titlegt lt/headgt ltbody
bgcolor000000 textffffffgt lth1gtMy First
Pagelt/h1gt ltpgtltbgtThis is my first Page.lt/bgtlt/pgt lta
hrefhttp//www.ucr.edu/alpha.htmlgtMy first
linkltagtltbrgt ltimg srchttp//www.ucr.edu/images/de
sign4/title.gif width464 height98
altUniversity of California, Riversidegt lt/bodygt
lt/htmlgt
14
Questions?
15
Bullets

• Unordered List (bullets) ltulgtlt/ulgt
• Ordered List (numbers/letters) ltolgtlt/olgt
• Line Items ltligtlt/ligt
• Definition List ltdlgtlt/dlgt
• Definition Term ltdtgtlt/dtgt
• Definition Items ltddgtlt/ddgt

16
Bullets
ltolgt ltligtItem 1lt/ligt ltligt Item 2lt/ligt lt/olgt
ltulgt ltligtItem 1lt/ligt ltligt Item 2lt/ligt lt/ulgt
ltdlgt ltdtgtItem 1lt/dtgt ltddgt Item 2lt/ddgt lt/dlgt