发表于： 2019-11-14 20:31:59
1 1128
今日完成:
1.less的嵌套与继承
demo
css
.aa{
width: 300px;
height: 300px;
background: red;
margin:20px;
.bb{
width: 200px;
height: 200px;
background: yellow;
.cc{
width: 100px;
height: 100px;
background: blue;
}
.ff{
width: 50px;
height: 50px;
background: yellowgreen;
}
}
}
.dd{
.aa;
background: yellowgreen;
.bb{
background: black;
width: 150px;
padding-top:30px;
.ff{
background: white;
margin:auto;
}
}
.cc{
background: burlywood;
width: 150px;
margin:auto;
}
}
html
<div class="aa">
<div class="bb">
<div class="cc">
<div class="ff"></div>
</div>
</div>
</div>
<div class="dd">
<div class="bb">
<div class="cc">
<div class="ff"></div>
</div>
</div>
</div>
描述:下面盒子调用上面盒子属性
1.方添加属性,只要被调用盒子的类中没有,就不用考虑嵌套,可以直接添加
2.覆盖属性,要考虑调用盒子类中的嵌套下覆盖,
如:.dd调用.aa可以直接在,下方设置颜色,覆盖.aa原本颜色,
.bb在.aa中,dd调用.aa,所以可以在.dd{}中,直接.bb{}在括号中修改.bb已有属性;
.cc要覆盖属性,就需要在.bb{}内修改,直接修改无效,不会被覆盖,展现以调用类原本的效果
总结:
1.添加属性无需嵌套,只要注意同一嵌套树下类名没有重复,
ps:重复类名的规则之前有总结
2.修改覆盖原来的属性,原调用类里有嵌套,修改必须也有嵌套,并且中间少了,或者出错都不能修改覆盖成功
任务14,15总结
总结:(任务1~15)
最大的问题解决问题效率底下
原因:
1.一种问题多个方法,大脑会混杂在一起,没有区分开,思维混乱,纠缠,产生错误
解决;
所以想到的一种解决问题的方式,就是问题罗列出来,
学会问题拆分,分别解决,有几种方法,再结合实际,看哪些方法,可以结合到一起,使用,来解决问题
例如任务中遇到的问题:
模拟栅格布局,想到用媒体查询,那该怎么结合到一起?
拆分为row,和col分别模拟
row:
思路:
1.栅格是在同一列,可以用flex和float,我喜欢flex,就用了flex;
2.flex默认一行,就添加wrap,,让其中的col自动换行
3.row的flex布局,高度由最高的子元素设定,同一行高,且空col不显示
col:
1.怎么自动换行,用@media结合max,min-width,在视口不同的宽度下,也有不同的百分比宽度,达到换行的目的
2.需要自己计算多少列,占多大百分比宽度,除不尽用flex-grow:1属性平分剩下宽度
3.box-sizing:border-box集合padding,使其中内容可以直接设置边框(任务需要,灵活运用),且不用在设置边距
4.row一行一定要占满,一个col会占满整个row,根据实际需求看需要添加几个空的col
2.一些属性不能确定,或者认知飘忽不定,就做个demo确定下来,
如;
任务尾部的下画线,外边距的不同,造成下划线的不一致,
而row.col也是利用相似属性做出来的,但是认知去不明确
解决:
做demo做总结,确定自己所想的与与现实一致,打上思维补丁
3.时间管理,没有详细的规划,导致在一些地方有些钻牛角,浪费时间
解决:
每天都有一个计划
每个小时也要有个小目标,并且,思考这段时间学到什么
4.知识体系掌握杂乱,连接不紧密,类似总结2
解决:
每天抽出一定时间梳理css任务,还有深度思考,最低要做到认知没有偏差
5.自身性格有问题,有畏难心理,遇到问题总会犹豫萎缩一阵子,给自己找理由拖延
解决:
逼自己迎难而上.让自己习惯去解决难题,告诉怕不怕都得解决,没给结果带来一丝好处
如:轮播,按钮播放已经掌握,自动播放不知道怎么做,那就做自动播放,让自己逐渐适应,迎面解决问题
6.没有基础,学习一个知识点,是总是延伸出新的知识点,然后不断延伸,知识点散碎,错乱连接弱,还相互影响,扰乱思考
解决:
学习知识之前,要确定自己要学的主干,沿着这条主干,有分叉的知识点可以了解,
但是注意,不让分叉形成另一条主干,可以先记录下来,等需要再回头再看.
7.多总结多思考,不要闷头去学,并且总结出的东西要吸取教训,而不是自己敷衍自己
查看任务需求:
1. javascript是什么？
2.掌握javascript的基本语法；
3.了解javascript的全局函数；
4.学习使用javascript的自定义函数；
5.javascript如何操作DOM；
6.javascript如何修改CSS；
遇到问题:
1.总结任务14,15,一些有纠结的地放就,设置个demo搞明白
2.完成一个阶段,整个阶段的最大的问题就是慢,要思考原因是什么,怎么做可以改善
收获;
1.一些疑惑的地方,解开
2.尝试下先学后座任务,之前几乎一步一坑
明日计划:
1,按照官网上的要求先去了解
2.把任务需要的知识点先看一看
返回列表
评论