w1

------1.如何使li中文字保持垂直居中？

    貌似是height和line-height 保持一致；
    我尚未解决；

------2.在nav中让对应的li能够直接获取到大nav的背景高？

        先让bigList 的display：block；
    smallList li项 的display：inline-block；并设置width；

------3.清除a标签之间的间距？

    父元素A内设置 font-size:0;
    A a{ font-size:对应文字大小px；}
 
    或者
    父元素A中letter-spacing:-999px; A a{ letter-spacing:0;}

------4.文本居中：margin :0 auto;       width:100%;?

    在水平和垂直方向上，width、内边距和外边距的百分数值都表示为其父元素的宽度百分数，边框没有百分数值。
    块元素的父元素的height被声明为一个具体的值：height属性的百分数值就表示为父元素高度的百分数。

------5.class 和 id 使用的约定俗成；

只有在绝对确定这个元素只会出现一次的情况下，才应该使用ID。如果你认为以后可能需要相似的元素，就使用类。保持命名约定通用，并且使用类，就不会出现一长串ID选择器都与非常相似的样式相关联的现象：只需用一个普通的类替代它们：

    ID具有唯一性，Class具有普遍性。
    ID是唯一的，所以尽量在结构外围使用，通常用于页面布局。
    Class是可重复的，所以尽量在结构内部使用，通常用于样式定义。
    ID的样式优先级高于Class。

    id for js；class for css ；

------6.文档流 HTML流 普通流 三者的区别；

    文本流是文档流的民间说法，其实按照css标准里面来说，是没有这两个名词的，而只有“normal flow”，中文翻译成“普通流”。
    绝定定位和fixed是脱于文档流；
    浮动的元素没有脱离文档流，仍会占位。

------7.网页底部突然出现留白：

       可通过设置body  的height：100%；  解决

知识：A盒子包含着B盒子

1.弹性盒子：

    A盒子中display：flex；flex-direction：row/ column;来设置B盒子的排列方式；当A中未设置height时，其高度由B盒子的高度来决定；当A设置了height,B盒子的高度大于A中的高度时，会被压缩自适应于A盒子的高度；
    
    A盒子中display：flex；justify-content:center/space-around....;决定B盒子的排列方式；

2.float：

       当使用float时，则该对象被当做block处理，即相当于display：block；也就是说，即使当前组件的display属性设置了其他属性，其值依旧为block；

3.position：

         当属性为absolute时，该对象漂浮于页面之上，自己盒子位置的定位是根据最近一个具有定位设置的父元素；属性为relative时，保持在正常的HTML流中，参照前一个对象的位置来进行定位(无需position，即normal流中前一个盒子的位置）；通过top，left等对盒子位置的偏移，大前提是position；absolute/relative，（自我理解：就是在自己的位置上插一面旗子，来定位；在对盒子进行位置的偏移的时候就是找旗子的过程（父旗子或邻旗子））；

4.clear:both;

清除左右的浮动；从而实现换行；

5.css中的包裹性：

元素的宽度会收缩到与内容宽度一致；

    拥有包裹性的元素；float的元素； position为absolute或fixed；
        overflow;      display：inline-block/ inline-flex/table-cell/table-caption;