HTML

(HyperText Markup Language)

1. STRUKTUR

 Example
 Body, Head dan Title
 First Test
 View Source

2. TEXT

 Abbreviation
 Addres
 Bold
 Citaiton
 Definition
 Emphasis
 Example
 Heading
 Horizontal -rules
 Insert-and-delete
 Italic
 Line breake
 Paragraph
 Quotation
 Strikethrough
 Strong
 Superscript-and-subscript
 White space

3. List

 Order List
 Unorder List
 Definiton List
 Nested List
 Example

4. Link

 Writing Links
 Linking to other sites
 Linking to other pages
 Email links
 Opening links in a new window
 Linking to a specific part
 Example

5. Images

 Adding images
 Height and width of images
 Where to place images
 Alingning images horizontal
 Alingning images vertical
 Examining images on the web
 Figure and figure caption
 Example

6. Tables

 Basic Table Structure

 Teble headings
 Spanning Columns
 Spanning Rows
 Long Tables
 Width and spacing
 Border and background
 Example

7. Forms

 Form structure
 Text input
 Password input
 Textarea
 Radio Button
 CheckBox
 DropDown List Box
 Multiple Select
 File input box
 Submit Buttom
 Images and Hidden Controls
 Labeling Form Controls
 Grupping from Elements
 HTML 5 validation
 HTML 5 date input
 HTML 5 email input
 HTML 5 URL input
 HTML 5 search input
 HTML 5 Placeholder
 Example

8. Ekstra Markup

 Comments in html
 id attribute
 class attribute
 block elements
 inline elements
 gruping block elements
 gruping inline elements
 iFrames
 Meta
 Example

9. Flash, Video dan Audio

 Adding a flash movie

 adding a flash video
 adding html 5 video
 HTML 5 multiple video source
 adding a flash mp3 player
 adding html5 audio
 html 5 multiple audio source
 example

10. Introduction CSS

 Thingking inside the box (bordereless)

 Thinking inside box
 Example
 Example css
 Using Eksternal css
 Style css
 Using internal css
 css selector
 how css rules cascade
 inheritence

11. Color

 Foreground css
 Background css
 Opacity
 HSLA
 Example

12. Controlling Text

 Font-Family
 Font-size
 Font face
 Understanding font formats
 font weight
 font style
 text transform
 text decoration
 Line Height
 letter and word spacing
 text align
 vertical align
 text indent
 text shadow
 first latter and line
 link visited
 hover active focus
 example
 no style

13. Boxes
 Width height
 min width max width
 min height max height
 overflow
 white space vertical margin
 white space vertical margin (no space)
 border width
 border style
 border color
 border shorthand
 padding
 margin
 centering content
 display
 visibility
 border images
 box shadow
 border radius
 eliptical shapes
 example

14. Table, List & Form

 List style type

 List style imges
 list style position
 list syle shothand
 table properties
 empty cell
 gaps between cell
 styling text inputs
 styling submit buttons
 styling fildsets and legends
 alignig form controls: problem
 alignig form controls: solutions
 cursor
 example

15. Layout
 Normal flow
 Relative position
 absolute position
 fix position
 overlapping element z-index
 overlapping : without z-index
 floating elements
 using float to place elements side by side
 clearing floats
 present of floated elements : problem
 present of floated elements :solution
 creating multi-column layout with floats : two columns
 creating multi-column layout with floats : three columns
 a fixed width layout
 a liquid layuot
 a grid - based layout using 960.gs
 multiple style sheets : import
 multiple style sheets : link
 example

16. Images

 Controling Size images in css

 Alignig images in css
 centering images using css
 background images: body
 background images : elements
 background repeat
 Background attachment
 background position
 background position : percentage
 background shorthand
 images rollovers and sprites
 CSS3:Gradients
 example

17. HTML 5 LAYOUT

 EXAMPLE