zoukankan      html  css  js  c++  java
  • CSS3 兼容性写法

    transform

    transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    

     transform-origin

    transform-origin:20% 40%;
    -ms-transform-origin:20% 40%; 		/* IE 9 */
    -webkit-transform-origin:20% 40%;	/* Safari 和 Chrome */
    -moz-transform-origin:20% 40%;		/* Firefox */
    -o-transform-origin:20% 40%;		/* Opera */
    

    线性渐变 - 从上到下(默认情况下)

    下面的实例演示了从顶部开始的线性渐变。起点是红色,慢慢过渡到蓝色:

    #grad {
      background: -webkit-linear-gradient(red, blue); /* Safari 5.1 - 6.0 */
      background: -o-linear-gradient(red, blue); /* Opera 11.1 - 12.0 */
      background: -moz-linear-gradient(red, blue); /* Firefox 3.6 - 15 */
      background: linear-gradient(red, blue); /* 标准的语法 */
    }
    

    线性渐变 - 从左到右

    下面的实例演示了从左边开始的线性渐变。起点是红色,慢慢过渡到蓝色:

    #grad {
      background: -webkit-linear-gradient(left, red , blue); /* Safari 5.1 - 6.0 */
      background: -o-linear-gradient(right, red, blue); /* Opera 11.1 - 12.0 */
      background: -moz-linear-gradient(right, red, blue); /* Firefox 3.6 - 15 */
      background: linear-gradient(to right, red , blue); /* 标准的语法 */
    }
    

    线性渐变 - 对角

    你可以通过指定水平和垂直的起始位置来制作一个对角渐变。

    下面的实例演示了从左上角开始(到右下角)的线性渐变。起点是红色,慢慢过渡到蓝色:

    #grad {
      background: -webkit-linear-gradient(left top, red , blue); /* Safari 5.1 - 6.0 */
      background: -o-linear-gradient(bottom right, red, blue); /* Opera 11.1 - 12.0 */
      background: -moz-linear-gradient(bottom right, red, blue); /* Firefox 3.6 - 15 */
      background: linear-gradient(to bottom right, red , blue); /* 标准的语法 */
    }
    

    使用角度

    如果你想要在渐变的方向上做更多的控制,你可以定义一个角度,而不用预定义方向(to bottom、to top、to right、to left、to bottom right,等等)。

    #grad {
      background: -webkit-linear-gradient(180deg, red, blue); /* Safari 5.1 - 6.0 */
      background: -o-linear-gradient(180deg, red, blue); /* Opera 11.1 - 12.0 */
      background: -moz-linear-gradient(180deg, red, blue); /* Firefox 3.6 - 15 */
      background: linear-gradient(180deg, red, blue); /* 标准的语法 */
    }
    

      

    box-sizing属性

    box-sizing: border-box;
    -moz-box-sizing: border-box; /* Firefox */
    -webkit-box-sizing: border-box; /* Safari */
    

      

      

  • 相关阅读:
    selenium爬虫 :使用selenium爬取淘宝某口红店铺的用户对商品的评价
    在scrapy框架 使用ImagesPipeline 抓取下载某牙直播主播直播间封面的图片!
    在multiprocessing.dummy线程池,基于线程 pool.map(callback,alist)再次处理数据:爬取某音乐网站热歌排行榜里面的歌曲!
    selenium 模拟登陆 + requests 抓取登陆后的数据:某小说网站
    vue的基本使用总结一
    登录页面设计
    Auth模块
    批量插入/分页器
    前后端传输数据的编码格式(contentType)
    ajax
  • 原文地址:https://www.cnblogs.com/handsome-jm/p/8005576.html
Copyright © 2011-2022 走看看