发表于: 2017-03-16 20:33:24
4 785
【今天完成的事情】
1、任务相关的事:页面都写得差不多了,可能还有一些细节要修改。。
2、其他的事:听了一下js的发展历史,搜了一下js之父BrendanEich,没想到出来第一条新闻竟然是说他因反对同性恋婚姻而从mozilla辞职的消息....= =....看了两眼他的个人网站和twitter...嗯,感谢互联网时代。。
然后看了一下https://www.javascript.com这个网站,唔,跟fcc的模式有点像,不过没有玩很久,就看了几分钟。
【明天计划的事情】
再检查修改一下。还有整理一下css样式表的代码,让那些通用的样式另外放到一个样式表里。整理一下让代码更简洁干净。
【遇到的问题】
1、不定宽没有看得很懂,最后还是用的栅格来布局页面3;
2、页面2那个遮罩,参考了一下师兄的方法,用的opacity+hover伪类,并且用了absolute定位并设置百分比高度。(不过由于absolute定位不是特别懂,所以这个百分比的高度其实不是很懂是怎么继承来的)
3、看到"做任务中"里有个问题“如何在不懂js的情况下,使用bootstrap自带的轮播插件?”才知道,哦,原来bootstrap自带了有轮播的方法,然后就去找菜鸟教程,他的bootstrap的内容里有教自带的轮播方法,几乎就是拿来就可以用。。所以我也只是看了两眼代码改了一下左右切换还有图片的路径而已。。不算是学会了。
4、iconfont里要注意一个问题,就是加入了新的图标之后,要点击那个“下方新icon来袭,点击生成新代码”,会出现一段新的代码引用链接,要重新引用到<script src=" " type="text/javascript"></script>这个src里面,不然就不会生效。一开始我不知道,看到"来袭"俩字总以为是广告...= =....
5、师兄说的屏幕变小了页面2“职业”那个页面里就会乱糟糟,我改了一下第一行的图片的class为img-responsive,它旁边的文字设置了换行。借了个14寸的笔记本×(win10系统IE浏览器)看了一下好像没有乱糟糟了。但是还有屏幕更小的,看不到。。用手机看不行,屏幕太小了。而且手机的又是另外一个页面吧?应该是任务9了吧?
还有,这个问题,另外有个疑惑,就是又开始不明白是屏幕的问题还是分辨率的问题,因为F12审查的时候,其实还是乱的..(真是学艺不精...)
不知道师兄那里看还会不会乱呢?
【收获】
1、遮罩可以用opacity和伪类:hover来实现。
首先是一个遮罩层的div,把这个div的opacity值设置成0,并且弄一个黑色的半透明背景作为遮罩的背景颜色(用rgba来设),比如.mask-cover{background:rgba(0,0,0,0.5);opacity:0;}
然后把设置一下这个div的定位。用absolute,设置一下高度百分比。
接着这个块里头有什么别的要设置样式的就按一般正常的要设置那样设置就好了。
最后把这个div跟hover一起用,比如.mask-cover:hover{opacity:1;}
2、学到一个属性叫做text-indent,这是一个缩进属性。想要缩进两个字符,就设置这段文字的字体大小的两倍好了。
(ps:昨天忘了占坑,然后又过了12点了,就算了,就没写日报,我现在调了闹钟记得占坑了;再ps:现在重度依赖bootstrap,而且还一知半解)
评论