今天完成的事情： 

折叠导航栏

通常，小屏幕上都会折叠导航栏，通过点击来显示导航选项。

要创建折叠导航栏，可以在按钮上添加 class="navbar-toggler", data-toggle="collapse" 与 data-target="#thetarget" 类。然后在设置了 class="collapse navbar-collapse" 类的 div 上包裹导航内容（链接）, div 元素上的 id 匹配按钮 data-target 的上指定的 id

开始做任务8的时候我先看了布局的具体，栅格系统还是很拥有用的，具体我会把重要的写在后面的东西，毕竟太重要了，我已经把这些记在了笔记上，bootstrap是个很重要的的东西，功能强大，但是因为自己的学习过于零散，所以还是需要加强自己的基础能力，过于懒惰的我，我偷偷下了插件，class类名的bootstrap的插件，所以打起来比较方便吧，稳下心来继续学，加油！

今天做了这点东西，用了媒体查询

CSS3 的多媒体查询继承了 CSS2 多媒体类型的所有思想： 取代了查找设备的类型，CSS3 根据设置自适应显示。

媒体查询可用于检测很多事情，例如：

• viewport(视窗) 的宽度与高度
• 设备的宽度与高度
• 朝向 (智能手机横屏，竖屏) 。
• 分辨率

目前很多针对苹果手机，Android 手机，平板等设备都会使用到多媒体查询。

我通过这些东西来设置了以下的

当大于768px的时候

然后小于的时候就会隐藏，

用布局绘制了这些，我感觉应该把bootstrap4的class类名用一下，因为是弹性布局，我现在没有用弹性布局所以导致我现在这样，只要缩小图形就会变形

通过画圆

然后圆形用的阴影

阴影inset

1、inset
可选值，默认阴影在盒子外
使用inset后，阴影在盒子内，即使指定边框或者透明边框，阴影依然存在。

2、<offset-x> <offset-y>
这是头两个<length> 值，用来设置阴影偏移量。offset-x为设置阴影的水平位移，假如是负值，那么阴影在边框的左侧；offset-y设置阴影的垂直位移，假如是负值，那么阴影位于边框顶部。这个用数学中的数轴来理解应该是可以的，如下图：

我们的水平原点是以边框的左上角为起始点，x为水平位移，Y为垂直位移。

3、<blur-radius>
指定模糊半径，不允许负值，假如设置为0，则阴影不模糊，否则设置越大的值，边框阴影就越模糊。

4、<spread-radius>
指定阴影拓展，假如设置为0，不拓展，正值阴影扩大，负值缩小。

明天计划的事情：
遇到的问题：
收获：