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 会叠压。