Getting started with CSS3

Get Started. It's Free
or sign up with your email address
Rocket clouds
Getting started with CSS3 by Mind Map: Getting started with CSS3

1. Selectors

1.1. Simple Selectors

1.1.1. Class

1.1.2. Element

1.1.3. ID

1.1.4. The Universal Selector

1.2. Descendant selectors

1.2.1. Selector chain

1.2.2. Child selector

1.3. Pseudo-class

1.3.1. :link

1.3.2. :visited

1.3.3. :active

1.3.4. :hover

1.3.5. :focus

1.3.6. :checked

1.3.7. :lang(language)

1.3.8. :not

1.3.9. :nth-child(integer)

1.3.10. :nth-child(an + b))

1.3.11. :nth-last-child(integer)

1.3.12. :nth-last-child(an+b)

1.3.13. :only-child

1.3.14. :only-of-type

1.3.15. :first-of-type

1.4. Pseudo-element

1.4.1. ::first-line

1.4.2. ::first-letter

1.4.3. Content inserting pseudo-elements

1.4.3.1. ::before

1.4.3.2. ::after

1.5. Grouping

1.6. Subsequent adjacent sibling selectors

1.7. Subsequent sibling selectors

1.8. Attribute selector

1.8.1. Attribute exists

1.8.2. Attribute has value

1.8.3. Attribute has word (delimited by spaces)

1.8.4. Attribute has word (delimited by spaces or hyphens)

1.8.5. Attribute contains word anywhere

1.8.6. Combined with pseudo-class

1.8.7. Starts with selector

1.8.8. Ends with selector

2. A style

2.1. selector

2.2. declaration block

2.3. comment /*...*/

3. Where they live

3.1. Separate file

3.1.1. Specify charset

3.2. Inline style

3.3. Embedded

4. media attribute

4.1. all

4.2. braille

4.3. embossed

4.4. handheld

4.5. print

4.6. screen

4.7. speech

4.8. tty

4.9. tv

5. Importing style sheets

6. Precidence

6.1. important

6.2. The order...

6.3. Determining the specificity

7. Colours

7.1. #rrggbb

7.2. #rgb

7.3. rgb(0, 255, 126)

7.4. rgb(20%, 100%, 10%)

7.5. Transparency

7.6. hsl(270, 50%, 50%)

8. Text

8.1. Font groups

8.1.1. serif

8.1.2. sans serif

8.1.3. monospace

8.1.4. cursive

8.1.5. fantasy

8.2. Style rules

8.2.1. Font families

8.2.1.1. p { font-family : arial "times new roman" sans-serif; }

8.2.2. Font size

8.2.2.1. p { font-size: 1 px;; }

8.2.2.2. p { font-size: 150%; }

8.2.2.3. p { font-size: 1.5em; }

8.2.2.4. p { font-size: 1in; }

8.2.2.5. p { font-size: 1cm; }

9. Box Model

9.1. border: value or border: top right bottom left

9.1.1. border-top

9.1.2. border-left

9.1.3. border-right

9.1.4. border-bottom

9.2. padding

9.3. margin: value or margin: top right bottom left

9.3.1. margin-top

9.3.2. margin-left

9.3.3. margin-right

9.3.4. margin-bottom

9.4. background-color

9.5. border-style

9.6. border-color

10. Positioning

10.1. box-sizing

10.1.1. content-box

10.1.2. border-box

10.1.3. padding-box

10.2. Types

10.2.1. Absolute Positioning

10.2.2. Fixed Positioning

10.2.3. Relative Positioning

10.2.4. Static Positioning

10.3. float

10.3.1. float: left or float: right

10.3.2. float: inherit

10.3.3. Clearing the float: clear: both;