今天完成的事情

1.将git重新配置好，并能正常使用git完成增删操作

2.完成任务十二也就是重构页面六的修改

今天遇到的问题

问题1：git之前我就一直在学习了解，在使用GitHub的时候，可以发现不能删除仓库中的文件夹，而是只能一个一个文件的去删除， 且文件夹的更新也是上传整个文件夹进行覆盖操作的，用起来十分麻烦，而用git来实现就会非常方便，一个是git可以离线操作，一个是上传或者下载的速度会比直接使用GitHub快很多，以下截图是我在使用git进行文件夹更新操作的时候，频繁报错的一个地方。

解 决：在新建一个文件并关联git后，发现并不会象上图一样报错，由于目前对于git的使用还不够深入，所有最终是新建一个文件夹，将之前的任务文件拷贝过来，重新关联GitHub，发现可以成功更新，至于之前为什么一直报错，原因不得而知，只能待以后深入学习git后再来研究。

问题2：如下图，下图中的border师兄要求使用渐变效果，之前看到ui图确实有渐变效果，但是自己不太重视，今天也是整整一个小时才搞定这个。

解 决：开始一直在百度搜索各种css渐变效果，但是发现各有各的使用方式，参数各不相同，最终自己选了一个，终于调试出来了自己想要的效果，如下图

代码如下：

其中渐变效果的主要参数是border-image，括号中三种颜色，效果就是完成渐变，但是如果没有后面的两个数字参数，border都不会出现，百度搜了一会也找不到这两个参数的作用，最后自己对两个参数不停修改，发现第一个参数决定的是渐变效果的距离，当它为负数时，渐变效果消失，而后面的参数无论数值为多少，好像都不影响渐变效果，但是一旦不要这个参数，渐变效果立马消失，这里还不是很了解。

问题3：如下图，下方的轮播小圆点在进行任务七的时候，用的盒子做的，今天想用ul标签做但是不知道怎么做

解决：最终在参考别人的教程后写出来了，代码如下：

今天的收获

使用CSS实现背景色渐变、边框渐变，字体渐变的效果。

背景色渐变

linear-gradient: ([ <angle> | to <side-or-corner>, ]? <color-stop> [, <color-stop> + ])

angle | side-to corner 定义了渐变线，to-bottom 等同于180deg, to-top 等同于0deg。
color-stop 定义渐变的颜色，可以使用百分比指定渐变长度。比如：

背景色渐变非常简单，但上面的css代码中，linear-gradient是加在background属性上的。于是测试下具体是加在了哪个属性上，首先感性上就觉得是加在了background-color上，修改代码background为background-color之后，果然，渐变色没有了。
仔细看下linear-gradient的定义：

于是，这应该是个image了，修改代码background为background-image，结果渐变色保持如上图。

字体渐变

这种字体渐变的方法可以这么理解：字体本身是有颜色的，先让字体本身的颜色变透明（text-fill-color为transparent），然后添加渐变的背景色(background-image: line-gradient...)，但是得让背景色作用在字体上(background-clip: text)。

要注意的是：

• * text-fill-color 是个非标准属性，但多数浏览器支持带-webkit前缀，所以使用时需要带上-webkit前缀。
• * background-clip属性虽然多数浏览器已经支持，但text属性值浏览器支持还需要加-webkit前缀。
•  （参考这里：  https://developer.mozilla.org...）
• * 以上两条，通常使用postcss时是不会自动加前缀的，所以也就不能偷懒。
• * 要注意-webkit-text-fill-color: transparent对字体带来的影响，因为设置了透明，笔者在使用时踩了坑，同时 使 用了text-overflow: ellipsis; 这个时候是看不到点点点的。
• 
  

明天的计划

开始做任务十三第二个页面