day2

1-css 中的 px em rem 长度单位的区别？
     1.px（像素）
        px单位的名称为像素，它是一个固定大小的单元，像素的计算是针对（电脑/手机）屏幕的，一个像素（1px）就是（电脑/手机）屏幕上的一个点，即屏幕分辨率的最小分割。
     2.em（相对长度单位）
        em单位用的也比较多，特别是国外；em单位的名称为相对长度单位，它是用来设置文本的字体尺寸的，相对于父级元素对象内文本的字体尺寸；如果没有人为设置当前对象内文本的字体尺寸，那么它相对          的是浏览器默认的字体尺寸（16px）。
     3.rem（css3新增的相对长度单位）
        rem是css3新增的一个相对长度单位，它的出现是为了解决em的缺点，em可以说是相对于父级元素的字体大小，当父级元素字体大小改变时，又得重新计算。rem出现就可以解决这样的问题，rem只相对            于根目录，即HTML元素。所以只要在html标签上设置字体大小，文档中的字体大小都会以此为参照标准，一般用于自适应布局。
     4.%（百分比）
        %也很常见，它和em差不多一样，都是相对于父级元素。但%可以在很多属性中使用，比如：width、height、font-size等。而em是用来设置字体大小（font-size）的单位，width、height等属性是没有em单          位的。
     5.px、em、rem和%的区别与总结
        px是固定长度单位，不随其它元素的变化而变化；
        em和%是相对于父级元素的单位，会随父级元素的属性（font-size或其它属性）变化而变化；
        rem是相对于根目录（HTML元素）的，所有它会随HTML元素的属性（font-size）变化而变化；
        px和%用的比较广泛一些，可以充当更多属性的单位，而em和rem是字体大小的单位，用于充当font-size属性的单位
        一般来说：1em = 1rem = 100% = 16 px
2-css3 新增伪类有哪些？并说明
       :first-of-type选择器匹配属于其父元素的特定类型的首个子元素的每个元素。
       :last-of-type 选择属于其父元素的最后元素
       :only-of-type 选择属于其父元素唯一的元素
       :only-child 选择属于其父元素的唯一子元素
       :nth-child(2) 选择属于其父元素的第二个子元素
       :enabled :disabled 表单控件的禁用状态。
       :checked 单选框或复选框被选中。
3-说明 css 选择器优先级顺序及判定标准
      规则：选择器的权重值表述为4个部分，用0,0,0,0表示。
　　　　　通配符*的权重为0,0,0,0
　　　　　标签选择器、伪元素选择器的权重为0,0,0,1
　　　　　类选择器、属性选择器、伪类选择器的权重为0,0,1,0
　　　　　id选择器的权重为0,1,0,0
　　　　　行内样式的权重为1,0,0,0
　　　　　!imporatant的权重为∞
　　　　　权重大的选择器覆盖权重小的选择器
　　　　　同样权重的选择器，后面的覆盖前面的
　　　　　层叠选择器按照权重相加的结果，大的覆盖小的
　　　　　!imporatant的权重最大，没得抢了
4-position 几个属性的作用？
      position 的常见四个属性值：
      relative，absolute，fixed，static。一般都要配合"left"、"top"、"right" 以及 "bottom" 属性使用。
     1）Static：
        默认位置，设置为 static 的元素，它始终会处于页面流给予的位置（static 元素会忽略,任何 top、bottom、left 或 right 声明）。一般不常用。
     2）Relative：
        位置被设置为 relative 的元素，可将其移至相对于其正常位置的地方，意思就是如果设置了 relative 值，那么，它偏移的 top，right，bottom，left 的值都以它原来的位置为基准偏移，而不管
        其他元素会怎么样。注意 relative 移动后的元素在原来的位置仍占据空间。
     3）Absolute：
        位置设置为 absolute 的元素，可定位于相对于包含它的元素的指定坐标。意思就是如果它的父容器设置了 position 属性，并且 position 的属性值为 absolute 或者 relative，那么就会依据父
        容器进行偏移。如果其父容器没有设置 position 属性，那么偏移是以 body 为依据。注意设置 absolute 属性的元素在标准流中不占位置。
     4）Fixed：
        位置被设置为 fixed 的元素，可定位于相对于浏览器窗口的指定坐标。不论窗口滚动与否，元素都会留在那个位置。它始终是以 body 为依据的。 注意设置 fixed 属性的元素在标准流中不占位置。
5-绝对定位和固定定位的区别？
       绝对定位中当一个DIV块的位置被定义为绝对定位的时候，也就失去了文档流即失去原本的位置，并且以父级为基准(父级元素必须是相对定位如果不是则一直往上找，直到找到body为止)来进行偏移,
       固定定位其实和绝对定位有很多相似之处只不过是基于当前页面来偏移。
6-浮动的作用和影响
       浮动(float)
       作用:解决盒子并排问题 
       标准流: 一行一个 从左侧边界开始放置
       浮动带来一个现象, 盒子并排放置 —> 脱离标准流 ,成为浮动流—> 不占界面位置
       父盒子的高度塌陷: 父盒子高度本来是由子元素撑开的,父亲的高度计算是从内容的高度得来的, 现在由于浮动元素不占位置,所以子元素高度无法计算,父盒子的高度就他塌陷了.
       清除浮动的影响
       现象:
       1: 给父盒子定高 height
       缺点: 不实际 实际中就是有时侯高度就是auto
       2: 给父元素加overflow:hidden属性
       触发BFC规则 (私人区域)
       处于BFC规则的盒子 其外的元素不会影响到它,它内部的元素也不会影响其外的盒子
       BFC规则说:只要是BFC盒子内部子元素浮动了,则父盒子会计算浮动子元素的高度  
       缺点: 会隐藏掉故意溢出的元素