盒模型的一些属性

2016-08-12  本文已影响14人  DRBIN

margin外边距

padding内边距

margin:10px代表所有的外边距

margin:10px 20px 30px 40px 上右下左

margin:10px 20px(上下 左右)

margin:10px 20px 30px 上 右左 下

背景属性

background(color url  repeat attachment  postion)

background-image:(url)

background-color背景色

background-image背景图片

background-repeat背景重复

background-size背景图片尺寸

background-attachment背景图片的固定(fixed不动 scroll滚动)

background-postion背景定位(x y x% y% left right center bottom top)

background-clip背景绘制区域(border-box加到边框里   padding-box加到内边距框里  content-box加到内容里

)

background-origin背景的定位区域

(border-box加到边框里   padding-box加到内边距框里  content-box加到内容里

)

background-repeat可取值为(repeat全重复  repeat-x在水平方向重复  repeat-y在垂直方向重复 no-repeat 显示一次)

图片位置的移动(放一个容器里如:div)body{

background-image: url("taobao_logo.png");

background-repeat: no-repeat;

}

#mydiv{

width: 200px;

height: 300px;

background-image: url("taobao_logo.png");

background-repeat: no-repeat;

margin-left: 200px;

margin-top:400px;

background-size:宽度 高度;(contain放大到足够的尺寸   cover放大,显示可能不全,背景完全覆盖整个区域)

上一篇下一篇

猜你喜欢

热点阅读