【web前端】css第二篇汇总来了 伪类选择器 元素转换 盒子模型等等超详细知识点，快点开看看吧-----第五篇

hello！我是乔乔白术，我又来了！给你们分享web前端的知识了，这是css第二篇，有想要看html和之前的内容的可以到上方的合集中进行查看！ 

8.  伪类选择器

    选择器:link{ }   未访问状态

    选择器:visited{ }   访问后状态

    选择器:hover{ }  鼠标悬停状态A

    选择器:active{ }  鼠标激活状态

    LoVe  HAte   爱恨原则

  9.  元素转换

    display ： block ；     转换为块元素

    display ： inline ；     转换为行内元素

    display ： inline-block ； 转换为行内块元素

    display ： none ；  元素隐藏

七.盒子模型

  1.分类 

    标准盒子模型    盒子大小=content大小+padding+border

    怪异盒子模型    盒子大小=width/height

  2.内容大小

    width   宽度

    height  高度

   

    溢出处理    overflow-x   overflow-y

    overflow : visible    默认  溢出部分可见

    overflow : hidden    溢出部分隐藏

    overflow : scroll      溢出部分滚动条

    overflow : auto       浏览器自动处理

  3.内边距  内补丁  内填充

   padding-top   上内边距

   padding-bottom    下内边距

   padding-left        左内边距

   padding-right     右内边距

  

   缩写：

   padding ： 值；                    四周的内边距一样

   padding ： 值1  值2；             值1代表上、下内边距，值2代表左、右内边距

   padding ： 值1  值2  值3；       值1代表上内边距，值2代表左、右内边距，值3代表下内边距

   padding ： 值1  值2  值3  值4；    值1代表上内边距，值2代表右内边距，值3代表下内边距，值4代表左内边距，按顺时针方向

  4.边框 

   border-width   边框宽度

   border-color    边框颜色

   border-style     边框样式

   值：1）none    无边框

         2）solid     实线

         3）dashed  虚线

         4）dotted   点状线

         5）double   双实线

  缩写： border ： border-width值   border-style值   border-color值 ；

  border-top     上边框

  border-bottom  下边框

  border-left     左边框

  border-right    右边框

  5.外边距  外补丁  外填充

   margin-top  上外边距

   margin-bottom   下外边距

   margin-left   左外边距

   margin-right  右外边距

  

   缩写：margin : 值 ；

            margin ： 值1  值2；

            margin ： 值1   值2   值3 ；

            margin ： 值1   值2   值3   值4 ；

  

   margin : 0 auto ;    块元素居中