CSS Basics

CSS Basics

1. Syntax

   • <head> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head>

2. Selectors

   • .class : Selects all elements with class name
   • #id : Selects the element with id
   • * : Selects all elements

3. Colors

   • style="background-color:_____;"
   • style="color:___;"
   • style="border:2px solid ____;"

4. Backgrounds

   • background-color
   • background-image: url("___")
   • background-repeat
     • no-repeat
     • repeat-x/y
   • background-position
   • background-attachment: fixed/scroll/local

5. Border

   • color
   • style
     • hidden
     • dotted
     • dashed
     • solid
     • double
   • width
   • radius
   • length

6. Margin

   • auto
   • inherit
   • collapse
   • outside of boders

7. Padding

   • inside of borders

8. Height/width

   • auto
   • length
   • %
   • initial
   • inherit
   • max/min

9. Links

   • a:link - a normal, unvisited link
   • a:visited - a link the user has visited
   • a:hover - a link when the user mouses over it
   • a:active - a link the moment it is clicked

10. Lists

    • list-style : Sets all the properties for a list in one declaration
    • list-style-image : Specifies an image as the list-item marker
    • list-style-position : Specifies the position of the list-item markers (bullet points)
    • list-style-type : Specifies the type of list-item marker

Images and files in the map