完成进度图的简单制作与拓展

完成进度图的制作

开发工具与关键技术：DW 盒子和背景图的巧妙结合
作者：周欢
撰写时间：2019/2/4

我们IT界在之后的发展必定要接触项目的，而每一项目也必然会有项目完成的进度。试想你正在做一个老板给你的项目，老板定会来询问你的项目的完成情况，那么你是选择口头描述你的完成情况，还是会选择使用直观图来诠释出来，让老板客户一眼就知道进展，此时是我的话定会选择后者。前者需要较强的表达能力不然无法描述清楚，而后者使用实例说话还会给你在老板面前偷偷加分哦。
来看一个例子：

clearfix 调用清楚浮动的类（调用前当然需要先建立类，否则无效果）

设计思路：先设计一个长宽适中的div，在给其添加背景图片，将其背景图调整为合适的位置，综合在一起便会有如下的效果

拓展:可以吧具体的项目流程添加进去，然后将每一个div可改为button按钮形式，再结合上期讲述的tab切换效果，又会是一个好的设计
拓展效果：

温馨提示：
在设计产品时，若我们能多巧妙的结合利用一些基础的设计，我们设计产品也就会轻松，产品代码量也就会减少。代码简练也是慢慢积累起来的，所以平时可以将同一问题点进行多方面的设计。换位思考是个很不错的解决问题的方案，换位思考能解决很多问题哦，多学会换位思考。