css盒子模型学习笔记

时间:2021-08-09 20:43:28
盒子模型
     margin    外边距(上下左右) 找到最近的一对象(父子关系,兄弟关系)
        margin-left  
margin-right
margin-top
margin-bottom

同时写就是居中对齐:
margin-left:auto; 
margin-right:auto;  
简写:
margin:像素        /* 上下左右都是同一个值*/
margin:像素 像素;   /* 第一个值代表上下,第二个值代表左右*/
margin:像素 像素 像素 像素;    /*上/右/下/左(顺时针)*/
margin 像素 像素 像素         /*上/左右/下*/
浮动: 
float:left;  左对齐  /*水平方向排列*/
    :right  右对齐
      
     容器的实际尺寸为:设计值+padding+边框
 
 
内边距 (相对自己填充)
 
padding-left
padding-right
padding-top
padding-bottom
padding:10px;             /*四个都一样*/
padding:20px 10px         /*上下/左右*/
padding:30px 10px 50px;   /*上/左右/下*/
padding: 20px 40px 60px 80px  /*上/右/下/左(顺时针)*/
  
div,span,.menu{}    样式连写,中间有逗号隔开/*集体声明*/