今天完成的事情：完成任务7，深刻了解一下栅格。

明天计划的事情：任务8还是缓一缓，多看一些基础知识。

遇到的问题：游戏结果页面页脚都为半透明。【使用background-color: rgba改变】

收获：

利用css实现背景透明，我们想要透明，需要调整的是不透明度，ps上面有，从0%完全透明到100%不透明。

方法：  opacity:x，x 的取值从 0 到 1，想要半透明opacity: 0.5 

            rgba(red, green, blue, alpha)，alpha的取值从 0 到 1，rgba(255,255,255,0.5)

效果图：

但是当设置opacity实元素的所有后代元素会随着一起具有透明性，所以现在一般用于调整图片或者模块的整体不透明度；opacity实现不了背景透明，文字不透明。

用rgba(red, green, blue, alpha)设置颜色的不透明度，一般用于调整background-color、color、box-shadow等的不透明度。

在background-color中使用rgba，可以得到我们想要的效果。

RGBA是CSS3引入的一个颜色的值。在CSS3中，我们可以用以下六种格式表示颜色，：

background:#f00;

background:red;

background:rgb(255,0,0);或者 rgb(100%,0%,0%);

background:rgba(255,0,0,1);

background:hsl(0,100%,50%);

background:hsla(0,100%,50%,1);

以上标识的都是红色。

display是设置元素的显示方法。display：none；设置元素不显示，这个时候元素会在页面的渲染流中消失。不占据任何空间。display并不会被继承。子节点消失是由于父元素从渲染流中消失造成，通过修改子节点的属性无法显示；

visibility是规定元素是否可见。就是是前提元素已经存在于渲染流了，通过设置属性值来更改其是否显示出来。visibility：hidden是继承属性，子节点消失是由于继承了hidden，通过设置visibility：visible，可以让子节点显示。