发表于: 2018-06-28 20:51:39

2 686


今天完成的事情:

今天改了ppt然后讲了小课堂,emmm,虽然准备不是很充分但是总算没有延期,下次会尽早做准备,拖延症是真的可怕,然后GitHub的使用不是很熟练,今天传ppt卡了很久,然后抽空看一下github的教程。写了任务七的深度思考还有任务总结,然后任务八切了图,看了相关资料,明天开始写任务八。



明天计划的事情:

明天敲任务八,然后敲任务八,一直敲任务八。看boostrap框架。


遇到的问题:

今天一直在弄小课堂,然后讲完之后,一直在摸索上传ppt,然后任务八,只是看一下,还没有开始写,所以没遇到什么问题。





禅道:

css-task7

任务开始:6.28

预计结束:6.30

禅道主页:http://task.jnshu.com/zentao/project-task-765.html




收获:

今天特意去看了html的空格

然后其他就是github的一些操作。


任务7-任务总结

任务耗时6天  超出预期3天。

任务链接https://wjxhd.github.io/task/html/task7.html

任务总结:

1.合理使用ul li标签

2.认识新标签audio

audio标签是html5的新标签用来定义声音,如音乐或其他音频

audio标签的值

autoplay 音频在就绪后马上播放,网页打开自动播放音乐

controls 显示控件,播放、暂停、声音按钮

loop 音乐循环播放,播放结束后再自动继续播放

muted 静音

preload 音频先加载,再播放

url 音频的地址

3.背景颜色半透明

css半透明

设置背景颜色半透明的样式

background:rgba(41,189,244,.6)

蓝色部分代表的是需要设置透明的颜色

红色部分代表的是透明度

1是代表不透明度是100%,透明度为0

.9是代表不透明度是90%,透明度为10%

.8是代表不透明度是80%,透明度为20%

.6是代表不透明度是60%,透明度为40%

.1是代表不透明度是10%。透明度为90%

0是代表不透明度是0,透明度为100%

其他的以此类推

4.vw主要用于页面视口大小布局,相对于rem,vm在页面布局上更加方便简单,vw逻辑非常清晰,"1vw = 1/100th viewport width",用viewport width的百分比来设置element width。

使用vw可做到雪碧图的自适应。


脑图



深度思考:

1.什么是CSS sprites?

sprites就是雪碧图,然后雪碧图是把小图片合并成为一张图片然后给他们位置控制他们,其目的是为了通过图片整合来减少对服务器的请求次数,从而提高 页面的加载速度,


2.什么是浮动?有哪些清除浮动的方法?

浮动通过float来实现,然后可以通过添加left,right,来进行浮动。

可以使用overflow属性来清除浮动,例如我们给浮动盒子的父元素加overflow:hidden;,,就是清除这个父元素中的子元素浮动对页面的影响.

然后还可以使用clear:both;他的意思是说左右不准出现浮动元素。

3.rgba和opacity的透明效果有什么不同?display和visiblity有什么区别?

RGBA是代表Red(红色) Green(绿色) Blue(蓝色)和 Alpha的色彩空间

R:红色值。正整数 | 百分数

G :绿色值。正整数 | 百分数

B :蓝色值。正整数| 百分数

A :透明度。取值0~1之间


然后opacity 属性设置元素的不透明级别。

 visibility属性用来设置一个给定的元素是否显示,假如用visidility隐藏了,但元素还占有原来的位置。

display如果加none的话就直接消失不再显示。


4.描述下z-index和叠加上下文是如何形成的?

形成的条件

根元素 (HTML)

2.绝对(absolute)定位或相对(relative)定位且 z-index 值不为"auto"

3.一个 flex 项目(flex item),且 z-index 值不为 "auto",也就是父元素 display: flex|inline-flex

4.元素的opacity

属性值小于 1(参考 the specification for opacity)

5.元素的 transform 属性值不为 "none"

6.元素的 mix-blend-mode 属性值不为 "normal"

7.元素的 isolation 属性被设置为 "isolate"

8.在 mobile WebKit 和 Chrome 22+ 内核的浏览器中,position: fixed

总是创建一个新的层叠上下文, 即使 z-index 的值是 "auto" (参考 这篇文章)

9.元素的 -webkit-overflow-scrolling

属性被设置 "touch"




返回列表 返回列表
评论

    分享到