CSS Basic knowledge frame diagram

CSS Basic knowledge Framework: (I: basic knowledge in miniature. Two basic knowledge frame diagram)

Basic concepts of 1.CSS style sheets

2. Style sheet base type-----1. inline style 2. Inline style 3. Link to external style sheet 4. Import external? type

3. Style Sheet Configuration method

4. Font properties----1.font-family

2.font-size (four size modes: Absolute size (Xx-small ... Medium. Xx-large7 species), relative (Larger,smaller,em), px,%)

3.font-weight (6 ways, normal (+), Bold (), bolder,lighter,100 ... 900,inherit)

4.font-style (3 kinds of normal,italic,oblique)

5.font-variant (Normal,small-caps,inhert)

6.font

5. Text Properties----1.text-align (5 attributes Justify,inherit) 2.letter-spacing 3.color (3 color characteristics)

6. Background color and image settings

1.background-color

2.background-image

3.background-repeat (5 kinds of Repeat,repeat-x,repeat-y,norepeat,inherit)

3.background-attachment (3 kinds of Fixed,scroll,inherit)

4.background-position (3 kinds of ways)

5.background-size

6.background-origin (from where to start showing background images 3 kinds of padding-box,border-box,content-box)

7.background-clip (crop padding-box,border-box,center-box,text)

7. Border

1.border-width (5 species of Border,border-left-width (Left,right,bottom))

2.border-style (border-(top|left|right|bottom)-style four species each have 9 different styles///none/dotted/dashed/solid/double/groove/ridge /inset/outset)

3.border-color

4.border-imge (5 species, border-image-source|slice|width|outset|repeace|)

8. Set the margin (margin (margin-left,,) padding)

9. Hyperlink settings for Web pages

1. Web link Properties (4 ways to link)

2. Add scroll bar Properties Overflow (overflow-x,overflow-y) each kind of four kinds of 1.visible (show all paragraphs, no scroll bar) 2.auto (? Show scroll bar over capacity) 3.hidden (hide scrollbar) 4.scroll (always show scroll bar)

3. Set cursor properties (cursor:hand|crosshair|text|wait hourglass |help|move|e-resize|ne-resize |nw-resize|s-resize|url (' # '))

10.css area and positioning

1.position Understanding (relative positioning and absolute positioning)

2.z-index Stacking Order

3.float Floating Properties

4.clear Purge Properties

5.clip is the scissors hand of CSS

6.overflow out of range (5 visible (out of partial overflow) Hidden,auto overflow is displayed otherwise, inherit)

7.visibility (4 kinds of Visible,hidden,collapse,inherit)

