用CSS代码设计三个竖直方向的小图标

案例思考：我们要在网页上面设计三个动感的图标，这三个图标是竖起方向的，那么我们在代码当中就要给出图标的位置与大小的样式，还要定义一下这些图形的地址，最后在图标上面还有一个文字的定义。

绿色小图标的定义。我们给出了排列方式的定义，我们给出了文字的宽、高、字体、颜色，展现方式，背景图片，文字内容等等。

我们再给出灰色小图标的定义。文字的样式与图片的样式也是一并定义出来。

我们再给出蓝色小图标的定义，也是同样的文字样式与图片的定义。

所有的定义完成之后，再检查一个所有的CSS代码，接着运行一下程序看看这个效果。这个竖直三图标的效果就做出来了。

我们也可以调整代码从而让图标的位置与内容发生变化。