移动

css3常用选择器

selector:nth-child()  selector:nth-of-type()  >=ie9   

http://www.daqianduan.com/3737.html

<section>
    <p>我是第1个p标签</p>
    <p>我是第2个p标签</p>  <!-- 希望这个变红 -->
</section>

p:nth-child(2) { color: red; }

  对于:nth-child选择器，在简单白话文中，意味着选择一个元素如果：

1. 这是个段落元素
2. 这是父标签的第二个孩子元素  

     要满足1是p元素 2是父元素的第二个子元素

p:nth-of-type(2) { color: red; }

 而p:nth-of-type(2)表示父标签下的第二个p元素

 

注意：区别

可使用父标签层级限制，而不是当前标签类型限制。如下示例：

dl :nth-child(2) {  } //有空格 
dd:nth-child(2) {  } 


html height:100%
html的高度就是屏幕高度 
html,body{height:100%}这样，html body 高度都是屏幕的css像素高度，即使内容超过了这个高度

如果不设置，则由内容撑开body，html的高度


viewport

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"/>

设置后，布局视口宽度=逻辑分辨率宽度
   
视觉视口  window.innerWidth  随缩放变
布局视口  document.documentElement.clientWidth 缩放不变
屏幕宽度  screen.width  不会随缩放变

不设置viewport
移动端浏览器 默认布局宽度 多为980px;