CSS_自适应_表格表单

 1.伪元素选择器

        追加进来的内容属于行内元素

           可以理解成：假的元素选择器===给他创造一个元素/标签

          1） 匹配第一行的伪元素选择器

           ：first-line  这里的冒号可以使用：：  ： 双冒号和单冒号 为了解决兼容问题

             div：：first-line{}

          2）匹配第一个字符的伪元素选择器

            ：first-letter 这里的冒号可以使用：：  ： 双冒号和单冒号 为了解决兼容问题

          3)向元素内部的正前方插入内容

             ：before  双冒号可以直接简写成：  为了解决兼容问题

             伪元素选择器实现效果：向前追加内容

             div：：before{

                 content：柠檬养乐多

             }

             通过伪元素添加的内容 是不占页面元素的

             语法：

             元素：before{

                 content："文本"

                 样式规则

             }

          4）向元素内部的正后方添加内容

            ：after 双冒号可以直接简写成：  为了解决兼容问题

            语法：

             元素：after{

                 content："文本"

                 样式规则

             }

        2.高度塌陷（面试题）

             高度塌陷：父元素里面有子元素，父元素不设置高度，并且，

             父元素的高度是被子元素撑开的

                 当给其中的一个或者是多个子元素添加浮动的时候，会让父元素的高度降低，这一情况被称值为=====高度塌陷

             高度塌陷解决:

              1)给父元素添加一个最小高度（为啥：如果你后面继续补内容或者元素的话，日语超出，显示溢出效果） 添加最小高度是为了解决自适应的问题

              2）本质原因：

              由于前面的元素浮动，导致后面的元素上去补位置，由于他上去补位置，导致父元素高度降低，并且，后面的所有的布局都上去了

              解决：可以给后面的补位元素清除浮动带来的影响

              clear：both 针对左浮动就是  clear：left  可以一对一  或者一对多清除浮动

              3）如果没有补位元素的话，父元素里面只有一个子元素，子元素浮动，产生了高度塌陷如果解决

                a.可以自己给浮动父元素添加一个overflow属性：hidden

                  除了有溢出隐藏的作用：触发BFC，并且让浮动的元素继续参与高的计算

                  用来解决父元素的高度塌陷

                b.你可以自己悄悄的在浮动的元素后面补一个元素，补位的元素必须是一个块级元素  

                  如果你非得补一个行内元素，你需要转换元素类型（不可取 会占页面元素） 但是这种方法是不可取的，原因：因为你自己悄悄补上的元素，占页面的位置

               4）最优化的方法

                万能清除法

                 .wannengqingchu：after{

                     必须的属性和内容====配套出现的

                     content：""；

                     因为你补位的元素是行内元素，需要转换成块级元素，才能清除浮动

                     display：block；

                     转换成块级元素之后，清除浮动带来的补位影响

                     clear：both

                     为了解决在ETC（杠精）的问题=====非得在content里面添加内容

                     需要把你content里面的内容隐藏掉