背景
border: 20px solid red;
background-color: #B0E0E6;
background-color: powderblue;
background-image: url(img/logo_05.jpg);/* 背景图 撑不开盒子 在前景图后 */
background-repeat:no-repeat;/* 参数 no-repeat repeat-x repeat-y水平 */
background-size:100% 100% ;
background-position: center center;/*默认的0px 0px 其他参数top bottom */
利用背景来渲染前端 :
一张图片的不同部分做不同的背景 减轻服务器压力
移动 背景图片不动
显示部分 上 加 下减,左加 右减
多张图片作背景,
background: url(img/icon_21.jpg) no-repeat,url(img/icon_28.jpg) right top no-repeat ;
背景固定
background-attachment:fixed ;/*固定 fixed 不随div滚动默认:scroll 随div滚动
背景图片
background-origin: border-box;
background-origin: padding-box;
background-origin: content-box;
背景颜色定位裁剪
background-clip: border-box; // 默认
background-clip: padding-box;//内边距里
background-clip: content-box;//内容里
# 块级元素 居中
**定宽度:**需要谁居中,给其设置 *margin: 0 auto;* (作用:使盒子自己居中)
不定宽度:默认子元素的宽度和父元素一样,这时需要设置子元素为*display: inline-block;*** 或 ****display: inline;****即将其转换成行内块级/行内元素,给父元素设置 text-align: center;
定位
首先设置父元素为相对定位,再设置子元素为绝对定位,设置子元素的left:50%,即让子元素的左上角水平居中;