任务13耽误时间较长，必须抓紧时间努力学习！

1、架构方式分了3个：

1.1 reset.css（重置样式，主要清除标签自带的样式，便于适应各浏览器，可以直接网上copy使用）

1.2 general.css（通用样式，主要是非变量的样式。根据自己喜好设置及命名，比如：

.fl{float: left}

.tc{text-align: center}

.fn{font-weight:normal; font-style:normal;}

.cw{color:white;}

.cl{clear: both}

。。。）

1.3 public.css（公共样式，适用于任务，部分重复率较高的变量样式，比如：

header{padding: 0 30px;height: 80px;width:calc(100% - 60px);}

.back-blue{background:#29bde0}

.corlor-gray{color: #a6a6a6}

.font16{font-size: 1.6rem}

。。。）

2、任务本身没有什么，主要是重新优化了部分html代码，然后用less修正了css。

3、由于不能使用BS，任务1计划重新做轮播和侧边框弹出。

3.1 侧边框主要使用absolute进行定位，width:50%;left:-50%;隐藏到左侧。然后加入:

#tm:checked ~ .back-blue ul {left: 0;},将点击后的定位弹出。

3.2 本来想照着bs代码写轮播，结果空有样式，一直无法实现轮播，不知道哪段代码样式没有加进去，好处就是对BS轮播代码更熟悉了，便于以后直接上手使用。

4、重新审视了投票页面，4个提示小窗口的写法，由于使用的雪碧图，多层加套后基本实现布局。

<div class="main-4-1-3">

    <div class="icon"><a href="#" class="icon-1"></a>

    2/3/4。。。

</div>

其中标签a固定长宽30px,放置背景全图，然后在上一层盒子icon中设置width和height 30px,通过计算（width+padding+margin=25%）确定padding+margind的值，将背景图固定在中间位置。

低分辨率下，使用媒体响应，设置icon整体缩放：transform:scale(0.75)，并重新设置padding和margin值;

6、学习难点主要是部分bs的实现原理。

7、任务14验收标准是学习情况的自适应，3天初稿，顺便看看才增加的提示部分的JS初级内容。