css实战知识整理

Css实战只是汇总

 

 

1 Css背景图居中

 

需求

首页都会有背景大图居中，并且自动撑满整个屏幕，保证图片不拉伸

 

代码

div{height: 500px; background:url(bg_index_new.jpg) center center;}

//必须指定高度，否则看不到背景图，一般高度设为和图片高度一样，这边设置为有重复，当图片小于屏幕宽度时，自动重复，两边都重复

 

 

2  padding和margin

设置padding里面的填充颜色还会填充，margin就不会填充，margin算是外面的东西

 

 

3 块状元素横向居中

         Margin{0 auto}

 

4行内元素垂直居中

父级元素设置line-height:等于height，若子元素是img则还要设置img{{display: inline;vertical-align:middle;}