background:
1、css2:background:background-color || url("") || no-repeat || scroll || 0 0;
css3: background: url("") || 0 0/cover || no-repeat || scroll || border-box || content-box || black;
CSS2中的Background属性:
background: background-color || background-image || background-repeat || background-attachment || background-position;
也可以分解写成:
background-color: color值 || RGBA值;
background-image: url();
background-repeat: repeat || repeat-x || repeat-y || no-repeat;
background-attachment: scroll || fixed;
background-position: <length> || <per>
CSS3中的Background属性
background: background-image || background-position/background-size || background-repeat || background-attachment || background-clip || background-origin || background-color
也可以分解写成:
background-image: url();
background-position: <length> || <per>
background-size: <length> || <per>
background-repeat: repeat || repeat-x || repeat-y || no-repeat;
background-attachment: scroll || fixed;
background-clip: padding-box || border-box || content-box;
background-origin: padding-box || border-box || content-box;
background-color: color值 || RGBA值;
这里有点特别需要注意,如果使用联写方式时,background-size需跟在background-position的后面,并用“/”隔着,即"background-position/background-size"。另外本人强烈建议CSS3中的Background属性不要全部联写,最好把CSS3中的属性拆分出来单独书写,因为他们在不同浏览器下需要加上自己的前缀,如:
background: background-color || background-image || background-repeat || background-attachment || background-position;
background-size: <length> || <per>
background-clip: padding-box || border-box || content-box;
background-origin: padding-box || border-box || content-box;
后面三个最好在运用时按前面介绍的,把各自的私有前缀加上。重温了一次两种标准下的Backgroud后,就正式进入今天的主题CSS3的多背景。
background:linear-gradient(black 50%, white 50%) ; 背景颜色黑色一半白色一半 默认从上向下