今天完成的事情：

昨晚笔记本硬盘崩了，今天晚上才修好，任务十已经完成了

这段代码主要是修改input样式的

.case{
    padding: 30px 0 30px 5vw;
}
input[type="radio"], input[type="checkbox"] {
    margin: 4px 6px 0;
    line-height: normal;
}
label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: bold;
}
.sky{
    padding-left: 10px;
    margin-top: 20px;
    text-align: center;
}
input[type="radio"] + label::before {
    content: "\a0";
    display: inline-block;
    vertical-align: middle;
    font-size: 18px;
    width: 1em;
    height: 1em;
    margin-right: .4em;
    border-radius: 50%;
    border: 1px solid #1d7ad9;
    text-indent: .15em;
    line-height: 1;
}
input[type="radio"]:checked + label::before {
    background-color: #fff;
    background-clip: content-box;
    padding: 2px;
    border: 7px solid #1d7ad9;
    border-radius: 50%;
}
input[type="radio"] {
    position: absolute;
    clip: rect(0, 0, 0, 0);
}

明天计划的事情：明天计划看一下任务十一作用到的知识点和资料，在准备一下下午的小课堂

遇到的问题：今天主要电脑坏了并没有完成什么任务，不过幸好的是任务十已经完成了

收获：本来昨晚就该写任务十的总结的，无奈晚上的时候笔记本硬盘终于不堪重负的崩了，所以今天算是啥也没干。

任务耗时4天

                                                                                            任务十总结

怎么说呢，感觉任务十的难点并不是很难，相比较我刚开始写任务八九的时候感觉简单的多，起码对Bootstrap的运用和理解更好了，任务是的话，唯一的难点应该就是一些样式的修改，比如输入框和下拉框，可以随便在百度找和w3c还有菜鸟教程上面找一些默认的样式，然后在根据百度上面搜索出来的资料进行一系列的修改。

                                                                                       深度思考

1.如何改变默认radio和select的样式？

修改radio默认样式

需要用到的工具如下：

label标签；

opacity属性;

:checked 选择器,匹配每个已被选中的 input 元素（只用于单选按钮和复选框）。

兄弟选择器：

+ 选择器（相邻兄弟选择器），可选择紧接在另一元素后的元素，且二者有相同父元素。

 选择器，作用是查找某一个指定元素的后面的所有兄弟结点。

4.2 修改select默认样式

appearance 属性，可以让元素看上去像标准的用户界面元素。

所有主流浏览器都不支持 appearance 属性。

Firefox 支持替代的 -moz-appearance 属性。

Safari 和 Chrome 支持替代的 -webkit-appearance 属性。

2.自适应小屏幕设备时，该如何布局？