css学习

一、优先级: 标签名选择器 < class选择器 < id选择器 < 行间样式

二、background 复合写法: color image position repeat

三、border 符合写法: border-width border-style border-color

  border-radius 圆角

四、padding 内边距

  padding-top 上内边距

  padding-left 左内边距

  padding-bottom 下内边距

  padding-right 右内边距

  padding:10px; 表示上右下左都是10px

  padding:10px 20px 第一个值代表的是上下 第二个值代表的是左右

  padding:10px 20px 30px 第一个值代表上、第二只代表左右、第三个值代表下

  padding : 10px 20px 30px 40px 第一个值代表上、第二只代表右、第三个值代表下、第四个值代表左

 五、margin 外边距

  margin-top 上外边距

  margin-left 左外边距

  margin-bottom 下外边距

  margin-right 右外边距

  margin:10px; 表示上右下左都是10px

  margin:10px 20px 第一个值代表的是上下 第二个值代表的是左右

  margin:10px 20px 30px 第一个值代表上、第二只代表左右、第三个值代表下

  margin : 10px 20px 30px 40px 第一个值代表上、第二只代表右、第三个值代表下、第四个值代表左

  标签的嵌套确定父子级

  1、子级的margin-top会在特定的情况下穿透父级(意思是自己的margin-top跑出了父级的边界)

    规避的方法:

      1、给父级加边框

      2、给父级加overflow:hidden;

      3、不要用margin-top,使用父级的padding-top

  2、兄弟关系的margin-top和margin-bottom 会叠压。

原文地址:https://www.cnblogs.com/GooPolaris/p/7919806.html