今天完成的事情：将任务10的主体部分代码进行了编写。截至写日志前，主体的内容已经完成90%。剩余一些问题目前还有解决，例如radio的样式问题等，没有完成昨天计划今天完成的目标，打算明天攻克一下。

明天计划的事情：继续任务10代码的编写，主要集中在radio样式的修改和网页响应式的调整上。

遇到的问题：

 第一点，和昨天看网页时的想法差不多，首先是流程图中的上半部分的框条，使用bootsrap框架下的进度条完成的。但是有个问题，目前只是完成了和psd模板上一样的效果，可是进度条怎么和1234这几个圆图标以及文字的颜色同时变化，并且12同时，123同时，甚至1234完成后同时变色的效果还不知道如何实现。不知道任务需不需要做出这样的效果。

 第二点，就是radio的样式问题了，下午查找了许多网上的资料，发现基本上的一个方法就是把原有的radio中的input使用label标签重新做一个圆点选中按钮替代掉。但是感觉好复杂呀！看来半天没看懂代码的意思。所以后来就暂时先放弃了，赶着先把网页整体的代码做完再说吧。目前就是简单地对input重新设置width和height来调整它的大小和psd模板的一样大，至于点击后里边的样式还是没有做出来。

 第三代：对主题中左边的radio和右边查看详情的下拉菜单框都设置display：inlin-block，想让他们排成一行，但是左边的三个radio会自动下降一定高度，不知道为什么，后来不得已，使用浮动对右边的下拉菜单框做了修订。还有父元素使用display：table，单选框和下拉菜单框设置display：table-cell，没有是内容垂直居中，并且选框内容部分变成了只占左半部分的样子，没找到问题的所在，就放弃使用了。目前是用margin值设置负值或者正值来达到在不同框下下拉菜单框垂直居中的效果。

收获：使用display：imline-block使左侧选框有垂直分布变成水平分布，不使用float：left，也可以达到所要的效果，并且选框还在面板内，面板内容的高度也是它们撑起来的，不用可刻意设置高度。第一次使用进度条，感觉还是好理解的，不过里头的样式值不少，需要多练习熟悉！