线性渐变和径向渐变理解

线性渐变

误区：不要认为两个终点位置之间后面一个终点的颜色，终点位置只是说那个点是这个色，但是设置这个主打一个渐变，两个终点位置是渐变过程。

线性渐变的渐变线是角度过中心点，最长那个方向的点作渐变线角度的垂线长度。0deg是从下往上的渐变线，角度是正的是顺时针旋转。

如下图，10%和30%不是对于渐近线所占都是这个色，不是的。是渐近线这个位置为这个颜色，设置下一个30%点是黄色，则10%到30%这一段是渐变过程显性的色。如下图0%没有则一直都是红色0%-10%则一段。10%都是在渐近线方向上的。设置了渐近线这个盒子都会被设置颜色。有些没有两个颜色如0%到10%则就是终点色/起点色。且不渐变。如果设置了都没写百分比，则第一个是0%，最后一个是100%，中间的平均分。线性渐变必须两个颜色。且无论几个色如果都没设置就第一个0%，最后一个100%，如果中间设置/两头有设置，都是到设置地方平分。

径向渐变

径向渐变和线性渐变原理差不多，不过这里渐变线是圆上所有的线。不过也是渐变过程。也是如果没有100%，没写百分比的时候也是和线性渐变相同，不过线性渐变整个盒子一定会满，因为盒子0%-100%。但是径向渐变的百分之几是半径从圆心往外的百分之几。100%半径长。但是径向渐变会如果半径小于盒子的方向，有空余，会那个方向上最后的颜色都是这个色。但是写css比html严格，必须最后一个颜色位置没有，

而前面必须有，

如果一个透明灰色，到一个透明色的渐变过程会显性在盒子上是白光。background-image的属性是在background-color上面的。

border也是复合属性，以空格隔开。不要边框可以设置0，0px，none。只写这几个不用写线的类型等。outline不行。