Link

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

span

<p class="tip"><span>提示：</span>... ... ...</p>

p.tip span {
font-weight:bold;
color:#ff9955;
}

基本结构

selector {
property: value;
            }

Some details

Pixels and ems：

Eg：font-size: 1em

em is a relative measure: one em is equal to the default font size on whatever screen the user is using

backup values for font

Eg: font-family: Tahoma, Verdana, sans-serif;

Not all computer understand all fonts,so we could tell CSS to try several

Two important selectors

1.IDs

 In html:   

           <p id="intro">Cascading with CSS</p>
 In css:

             #intro {  /*css*/  }

2.classes

In html:   

           <p class="red">Cascading with CSS</p>
In css:

             .red {  /*css*/  }

pseudo-class selectors

    selector:pseudo-class_selector
     {
       property: value;
       }

1. hover:

A link you’re hovering your mouse over

2.first-child：

Would make all paragraphs that are the first children of their parent elements red

3.nth-child:

Position

margin

        margin:1px 2px 3px 4px;

Note：It goes around clockwise (going from top to right to bottom to left)

Borders

        border: 2px solid red;

Padding

property

link去掉底线: text-decoration:none;

One selector to rule them all
 * {
      border: 2px solid black;
                                } 
display:
block:full width

inline-block:allow other elements to sit next to it on the same line

inline:It only takes up as much width as it needs

none:content disappear

Learning of CSS