zoukankan      html  css  js  c++  java
  • [css 揭秘]-css coding tips

    css 揭秘之css coding tips

    demo(1)

    html 代码:

    <body>
        <section>
            <div class="demo1"></div>
        </section>
    </body>    
    

     

    css 代码:

    .demo1{
       100px;
      height: 100px;
      padding: 6px 16px;
      border-image-repeat: 1px solid #444d88;
      background: red linear-gradient(red,white);
      border-radius: 4px;
      box-shadow: 0 1px 5px gray;
      color: white;
    }
    

      

    效果图:

    总结:

    css3 标签 linear-gradient 背景线性渐变

    先解释一下这个标签,linear-gradient 

    /* 旧语法,带前缀并且已经废弃,以支持老版本的浏览器 */
    background: -prefix-linear-zgradient(top, blue, white); 
    
    /* 新语法,不带前缀,以支持标准兼容的浏览器(Opera 12.1, IE 10, Firefox 16, Chrome 26, Safari 6.1) */
    background: linear-gradient(to bottom, blue, white);
    更多的描述可以参考:https://developer.mozilla.org/zh-CN/docs/Web/Guide/CSS/Using_CSS_gradients




  • 相关阅读:
    javascript 的继承实例
    [转载]编写高性能js
    弹出菜单
    xml xpath dta笔记
    jquery 学习笔记
    公用的css
    谷歌主页动画效果——利用视距暂留原理
    javascript 新知识
    ie6/7 bug大全
    javascript 原生实现 jquery live/delegate
  • 原文地址:https://www.cnblogs.com/ifannie/p/6193239.html
Copyright © 2011-2022 走看看