css3学习笔记一

Posted 逃学威龙

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了css3学习笔记一相关的知识,希望对你有一定的参考价值。

     首先界面是二维的但也可以有三维的效果。先了解浏览器兼容性问题,火狐加前缀(-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););

以上是关于css3学习笔记一的主要内容,如果未能解决你的问题,请参考以下文章

CSS3学习笔记一(选择器)

css3学习笔记

CSS3学习笔记

css3学习笔记

css学习笔记——CSS3 transition 属性

[CSS3] 学习笔记-CSS3选择器详解