css3学习笔记一

Posted 2020-08-05 逃学威龙

     首先界面是二维的但也可以有三维的效果。先了解浏览器兼容性问题，火狐加前缀（-moz-）IE加（-MF-）谷歌加（-webkit）,简单介绍css3的几个属性。

     对于背景来说如果是单纯着一种颜色可以会单调，css3支持对html元素进行梯度着色（gradient）包括线性（linear）的和环状（radial）的。

     div{

          background:-moz-linear-gradient(blue,red);/*默认的梯度方向是从上往下由蓝色逐渐变红*/

     }

     div{

         background:-moz-linear-gradient(left top,blue,red);/*从左上角开始梯度变化*/

     }

    

     div{

         background:-moz-linear-gradient(90deg left,blue,red 50%);/*从一半时开始红色*/

     }

    div{

          background:-moz-radial-gradient(blue,red);/*默认的梯度方向是从内到外由蓝色逐渐变红*/

     }

     关于环状其余的和线性的相似不过环状多了个重复变化可形成条状花纹background:-moz-repeating-radial-gradient(circle,black ,black 10px,white 10px,white 20px););