发表于： 2018-05-18 22:50:55
1 672
一、今日完成的情况
1、修改完任务8-9的代码，提交审核，并进行总结。
2、下载任务十的PSD文件，学习任务十涉及到的知识。
3、从师兄那继承了小课堂和学分统计的工作，学习熟悉了工作的内容和流程。
二、明天的计划
开始做任务十。
三、遇到的问题
1、导航栏的布局问题，在自己的电脑上，使用chrome和IE浏览器打开都没问题，但在其他的电脑上打开布局会有变化，高度会变化，造成布局被破坏，在自个电脑上修改也看不到效果........，有点纠结。
2、学分太少太难赚了，又全是僵尸学弟，来线下后，一篇日报没审过，还好一个月快到了就能划到僵尸营地去了......
解决办法：今天从师兄那接了赚学分的工作，熟悉了一下午，感觉比想象的繁杂一些，等熟悉一两次应该就没问题了。
四、收获
1、复习了一下伪元素的知识点，对伪元素的有了新的认识。（1）之前学习伪元素，只知道它可以在段前、段后、首字母和首行等添加元素或者改变元素样式的最最基础的用法。经过几次任务后，再回头看，发觉伪元素一是可以有效减少代码量，特别是段前和段后添加所需要的样式；二是在分辨率不同的情况下，对首行样式的作用很实用，用其他方法来实现会比较繁杂，还需要设置样式和媒体查询来实现。（2）需要注意的是，但为了规范化以及区分伪类，还是要写成双冒号。
2、初步学习了一些相邻兄弟选择器的知识
（1）定义：可选择紧接在另一元素后的元素，且二者有相同父元素。
（2）组合选择符：1>.“+”相邻兄弟结合符，作用是选择相邻的第一个子元素 。2>.“~”普通兄弟选择器，作用是选择父元素后所有名称相同的子元素 。3>.后代选取器（以空格分隔’ ‘），作用是子元素包含在父元素中，那么它继承父元素的所有属性，不管是几级嵌套子元素都会继承父元素的属性。4>.“>”子元素选择器，与后代选择器相比，子元素选择器只能选择作为某元素子元素的元素。
3、初步了解了一点表单选择器的知识
（1）:enabled选择器：表单元素有可用状态（“:enabled”）和不可用状态（“:disabled”），比如输入框，密码框，复选框等。我们可以通过伪选择器“:enabled”对这些表单元素设置样式。在默认情况之下，这些表单元素都处在可用状态。
（2）:disabled选择器：":disabled"选择器刚好与“:enabled”选择器相反，用来选择不可用表单元素。要正常使用“:disabled”选择器，需要在表单元素的HTML中设置“disabled”属性。
（3）:read-only选择器：":read-only”伪类选择器用来指定处于只读状态元素的样式。
（4）:checked选择器：在表单元素中，单选按钮和复选按钮都具有选中和未选中状态。在CSS3中，我们可以通过状态选择器“:checked”配合其他标签实现自定义样式，而“:checked”表示的是选中状态。可使用checked获取并隐藏处于选中状态的元素。
任务名称：CSS-TASK-08 和 TASK-09
成果链接：任务八和任务九
任务耗时：5月10日-5月18日，耗时8天。
技能脑图：
个人脑图：
官网脑图：
任务总结：
- 任务进度符合预期，未延期。任务8和任务9，总体来说还算顺利，对栅格布局掌握的比前两个任务好一些，只是在设计图的还原程度上不高，经过师兄指点才发现很多细节没有注意到，例如阴影，边框的小圆角，局部的高亮。本次任务耗时6天，前四天写完代码，经检查后还存在很多问题，又修改了两天，才基本符合了要求。在做这两个任务的过程之中，主要学习和使用了bootstrap的栅格布局、轮播图、导航栏以及怎么使用绝对定位和透明属性达成蒙版效果，还有阴影效果等属性。做完任务，梳理了一下深度思考，对浏览器内核、bootstrap常用组件（栅格布局、导航栏、轮播图）、margin负值、媒体查询等知识点有了更多的了解。
- 脑图对比分析：基本符合官网预期，自己的脑图只提到了任务8和9涉及到的新知识点，没有官网这么详实。
- 任务中遇到的疑难问题，（1）使用栅格布局时，5个元素等分排列怎么都无法对齐。解决办法：使用其他的布局方式即可解决。（2）ul列表使用 display: inline-block;横过来以后，li前面的圆点无法显示。解决办法：使用文字符号或者设置一个圆点的样式即可。
任务进度：
任务八-任务九
任务开始时间：
2018.05.10
任务完成时间：
2018.05.18
禅道：http://task.ptteng.com/zentao/project-task-679-unclosed.html
返回列表
评论