zoukankan      html  css  js  c++  java
  • CSS3新添加的属性

    1.圆角设置
      border-radius:15px 50px 30px 5px;
    
      /*四个值: 第一个值为左上角,第二个值为右上角,第三个值为右下角,第四个值为左下    角。
    
      三个值: 第一个值为左上角, 第二个值为右上角和左下角,第三个值为右下角
    
      两个值: 第一个值为左上角与右下角,第二个值为右上角与左下角
    
      一个值: 四个圆角值相同
    
    */
    
    2.阴影设置
       box-shadow:100px 100px 80px #888888;/*四个参数依次:距左距离 距上距离 模糊程度(数值越大越模糊) 颜色   (text-shadow为文本阴影)*/
    3.多背景设置
       background-image:url(xxx.gif),url(xxxxx.gif);/*支持多背景混合插入*/
    4.渐变设置(IE9以上)
       过度渐变:
       background: -webkit-linear-gradient(red, blue, green); 
       background: -o-linear-gradient(red, blue, green); 
       background: -moz-linear-gradient(red, blue, green);
       background: linear-gradient(red, blue, green); /* 标准的语法(必须放在最后) 参数个数不限可多节点变色   默认为从上到下渐变*/ 
    
       background: -webkit-linear-gradient(left, red, blue); 
       background: -o-linear-gradient(left,red, blue); 
       background: -moz-linear-gradient(left,red, blue);
       background: linear-gradient(left,red, blue); /*left也可以写成(10deg以角度方式渐变) 从左到右渐变*/
    
       background: -webkit-linear-gradient(left top, red, blue); 
       background: -o-linear-gradient(left top,red, blue); 
       background: -moz-linear-gradient(left top,red, blue);
       background: linear-gradient(left top,red, blue); /*从左上到右下渐变*/
    
       径向渐变: 
       background: -webkit-radial-gradient(red, green, blue,yellow);
       background: -o-radial-gradient(red, green, blue,yellow); 
       background: -moz-radial-gradient(red, green, blue,yellow);
       background: radial-gradient(red, green, blue,yellow); 
    

      

  • 相关阅读:
    django 常用命令
    nginx+gunicorn
    终于决定写个技术博客
    test
    自定义控件
    .net mvc 发布部署到机器上
    C# StringExt 字符串扩展
    MYSQL连接数据库
    List IEnumerable
    CentOS安装pip
  • 原文地址:https://www.cnblogs.com/zzq-include/p/4453274.html
Copyright © 2011-2022 走看看