每日一读

1.

<!--
    block:
           位置：垂直排列
           宽默认是父元素百分百 ，高默认是内容高
            
    line:
         位置：水平排列
        宽高默认是内容宽高
         不支持水平方向的margin和padding值!看到的知识表象而已
         
    float/absolute（包含快）:
               宽高默认是内容宽高 一定要制定宽高
        
    background背景颜色包含padding区域、
-->

<!--
权重记忆口诀:
从0开始，
一个行内样式+1000，
一个id+100，
一个属性选择器/class/伪类+10，
一个元素名，或者伪元素+1

    body #content .data img:hover
0+1+100+10+1+10
最终的权重值是0122；#content是一个id选择器加了100，.data是一个class类选择器加了10，：hover伪类选择器加了10， body和img是元素加了1    
-->

<!--
https://segmentfault.com/a/1190000000484493
伪类和伪元素的区别

    CSS 伪类用于向某些选择器添加特殊的效果。
    CSS 伪元素用于将特殊的效果添加到某些选择器。
伪类种类

伪元素种类

伪类的效果可以通过添加一个实际的类来达到，而伪元素的效果则需要通过添加一个实际的元素才能达到，这也是为什么他们一个称为伪类，一个称为伪元素的原因。
-->

<!--隐射
  css写在页面上
    Element下Element修改后不需要刷新就有效果（废话），无法直接隐射
    sources修改后需要先保存完成隐射，再刷新才有效果（重点）
 css写在单独的文件里
    Element修改后不需要刷新就有效果（废话），直接隐射
    sources修改后不需要刷新就有效果（再刷新效果也还在），保存后完成隐射

建议：css写在单独的文件里，Element修改直接看效果，直接隐射。

-->

<!--table
首先，我们需要知道的是：我们可以对表格table设置margin，而不能设置padding;对单元格td设置padding，而不能设置margin。所以说，我们不能对单元格td设置margin属性来调整单元格与单元格之间的距离，但是我们可以使用一下方法来达到同样的效果。
1) 设置padding
就像刚才所说的那样，我们可以对单元格td设置padding属性来调整单元格之间的间隔
td{padding:5px 10px;}
2) 使用标签
我们可以在单元格td内添加标签，然后对标签设置margin属性
p{margin:5px 10px;}  
3) 对表格table设置border-spacing(IE不支持)
　　先让我们简单了解一下border-spacing属性。border-spacing:length;设置单元格td的边在横向和纵向上的间距。当您指定一个length值时，这个值将作用于横向和纵向上的间距;当您指定两个length值时，第一个将作用于横向间距，第二个值将作用于纵向间距。
table{border-spacing:5px 10px;} 


table 可以设置 border-spacing 和padding，border-spacing 是外边框和单元格之间的间距，padding是外边框到单元格之间的间距！
-->


Alt + ↑:增加CSS度量单位->0.1单元
Alt + ↓:减少CSS度量单位->0.1单元 

↑:增加CSS度量单位->1单元
↓:增加CSS度量单位->1单元

shift+↑:增加CSS度量单位->10单元
shift+↓:增加CSS度量单位->10单元

Tab / Shift + Tab: 下一个/上一个属性


Ctrl + Shift + C: 选择页面节点并且查看代码,最常用!!
Ctrl + Shift + M: 进入仿真设备模式(移动平板屏幕)
Ctrl + Shift + D: 切换调试面板在底部还是侧边栏展示


Ctrl+Shift+I（进入开发者工具）
Ctrl+Shift+J （进入开发者工具，并定位到控制台Console）
Esc: 小菜单弹出隐藏
Ctrl + [ / ]:切换面板(向左向右)
ctrl+f 查找