前端学习笔记_css(1)

如何理解css呢?

css是层叠样式表(Cascading Style Sheet)。

如何使用?

  • 行内样式:
  
hello world
  • 嵌入样式:
  
  • 外联样式
  

css基础语法

选择器{属性:值;属性:值}

 p{font-size:15px;color:red;}

css常用选择器

ID选择器(#)
类选择器( . )
标签名选择器( p{} )
群组选择器(h1,div,p{})
后代选择器(div p{})

选择器的优先级

!important
行内:1000
ID:100
class,伪类,属性:10
元素:1
* : 0

css3新增的选择器

  • 同级元素通用选择器:
    E ~ F

  • 属性选择器:
    E[att=" val "]
    E[att^=" val "]
    E[att$=" val "]
    E[att*=" val "]

  • 与用户界面相关的伪类
    E:enabled
    E:enabled
    E:checked
    E:selection

  • 结构性伪类
    E:root
    E:nth-child(n)
    E:nth-last-child(n)
    E:last-child
    E:nth-of-type(n)
    E:nth-last-of-type(n)
    E:first-of-type
    E:last-of-type
    E:only-child
    E:only-of-type
    E:empty
    E:not(s)

ie的条件测试


hack

div{
    color: deeppink;  
    *color: blue;  /* ie6 7 */
    _color: red;   /* ie6 */
}

@media screen and (-webkit-min-device-pixel-ratio:0){    //争对chrome
    div{
        color: lime;
    }
}

你可能感兴趣的:(前端学习笔记_css(1))