页面的部分效果的实现

实现滑过之后有慢慢弹出的效果

在css里面设置transition: all 0.5s ease-in-out;

语法：transition: property duration timing-function delay;

值	描述
transition-property	规定设置过渡效果的 CSS 属性的名称。
transition-duration	规定完成过渡效果需要多少秒或毫秒。
transition-timing-function	规定速度效果的速度曲线。
transition-delay;	定义过渡效果何时开始。

这个样式和设置阴影样式box-shadow: 0px 2px 10px 5px #cccccc;结合能够实现如下图的效果：

图片贴合效果（上面移动图片仍固定在哪）

在css里面给div的背景图片设置这个样式

background-attachment: fixed;

效果图如下：

Bootstrap

1.有写好的css库，随意调用
2.栅格系统：随着屏幕或视口（viewport）尺寸的增加，系统会自动分为最多12列。它包含了易于使用的预定义类，还有强大的mixin 用于生成更具语义的布局。