新元素

• <div>逻辑容器

  能进行分组，等于用一个大的盒子进行包装

• <span> 内联字符的逻辑分组

• text-align 改变所有内联元素位置。

  属性

  • center 居中

行高

• 相对于自身高度的行间距

  #elixirs{
  
          line-height :1;
  
  }
  

子孙选择器

• 基本

  div h2{
  
      color: black;
  
  }
  

• 基于ID和类的 子孙选择器

  • 选择所有孩子

    #elixirs h2{
    
        color:black;
    
    }
    

  • 选择直系孩子

    #elixirs>h2
    

  • 选择孩子的孩子

    #elixirs blockquote h2{
    
        color:blue;
    
    }
    

伪类

• <a>

  a:link{
  
      color: green;
  
  }
  
  a:visited{
  
      color: red;
  
  }
  
  a:hover{
  
      color: yellow;
  
  }
  

  • link 本来的
  • visited 访问过后
  • hover 指到时
  • focus 聚焦时
  • active

• 很多元素都有伪类

层叠

• !important 读者层次表强行覆盖

改进输入方式

• padding 顶部逆时针

  padding: 0px 20px 30px 10px;
  

• margin 同理

  margin:0px 20px 30px 10px
  

• border 灵活随意分配，宽度，颜色，式样

  border: soild thin #007e7e;
  
  border: #007e7e solid thin;
  

• background 颜色，背景图，repeat,position(top left)

  background:white url repeat-x;
  

• font[font-style font-variant font-weight 必须再前]font-size/line-height font-family

  font:small/1.6em Verdana,Helvetica,Arial,sans-serif;