今天完成的事情：把任务十的页面写好了，对页面的布局、input的相关属性及响应式的变换熟悉了一点。

明天计划的事情：学习js，任务十通过了的话，就进行下一个任务的预习

遇到的问题：

1.在做单位长度填空那块时，不知道为什么input类型是text时，居然时无效的，改成number类型倒是有效的。

2.对页面结构样式做的不够精巧，自适应小屏幕时要修改大量的样式，运用各个属性比较生硬，大部分时间花在这上了，css代码量将近400行，觉得应该还能再压缩一下，还是得多学习。

收获：

1.在这个任务中运用input类型最多的是radio，如果要合成单选按钮组的话，必须name值相同，如果要设置哪个按钮预选的话，需要加个checked。这个checked属性只能与type="radio"或type="checkbox"的input元素配合使用。

要修改radio的样式方法是先写两个标签，radio类型的input及配套的label，然后把input隐藏掉，方法有用display:none或position: absolute;clip: rect(0, 0, 0, 0);，最后给label用伪元素::before来加图片（background的方式）或者是用纯css自定义一个块儿，最关键的交互是用checked和兄弟元素来完成的，放图：，这样就可以间接的使用单选按钮的特性来选中自定义的样式了。

2.下拉列表select框其实改起来很简单，只要添加上appearance:none，默认选择框样式去除，加框改字之类的都能用平常的属性，比如要另外添加个自定义下拉框箭头，用background：url(../image/....png)这种方式来添加图片就行了