background
background 设置背景,可以使用图片,也可以设置渐变背景,也可以设置多个背景。
利用 backgound,我们可以实现多个好玩的效果。
语法 #
/* 使用 <background-color> */
background: green;
/* 使用 <bg-image> 和 <repeat-style> */
background: url("test.jpg") repeat-y;
/* 使用 <box> 和 <background-color> */
background: border-box red;
/* 将背景设为一张居中放大的图片 */
background: no-repeat center/80% url("../img/image.png");
更多信息,请参考:MDN - CSS - background
应用 #
固定背景效果 #
演示地址:https://codyhouse.co/demo/fixed-background-effect/index.html

渐变背景动画 #
See the Pen Pure CSS Gradient Background Animation by Manuel Pinto (@P1N2O) on CodePen.
实现磨砂玻璃效果 #
See the Pen CSS only frosted glass effect by Gregg OD (@GreggOD) on CodePen.
多背景图像视差 #
See the Pen CSS Multiple Background Image Parallax Animation by carpe numidium (@carpenumidium) on CodePen.