zoukankan      html  css  js  c++  java
  • CSS3 background-origin 属性

    CSS3 background-origin 属性

    padding-box 背景图像相对于内边距框来定位。
    border-box 背景图像相对于边框盒来定位。
    content-box 背景图像相对于内容框来定位。
    <style>
    .back{
      background:url(naicha.jpg) no-repeat;
      background-size: cover;
      height:150px;
      width:200px;
      padding: 20px;
      border: 10px dashed #333;
      background-origin: border-box;
      margin:30px;
      float:left;
    }
    
    .back1{
      background:url(naicha.jpg) no-repeat;
      background-size: cover;
      height:150px;
      width:200px;
      padding: 20px;
      border: 10px dashed #333;
      background-origin: padding-box;
      margin:30px;
      float:left;
    }
    
    .back2{
      background:url(naicha.jpg) no-repeat;
      background-size: cover;
      height:150px;
      width:200px;
      padding: 20px;
      border: 10px dashed #333;
      background-clip: content-box;
      background-origin: content-box;
      margin:30px;
      float:left;
    }
    </style>
    <div class="back"></div>
    <div class="back1"></div>
    <div class="back2"></div>

  • 相关阅读:
    66. 缓存字节流
    65. 练习(拷贝图片--边读边写)
    64. 输出字节流(FileOutputStream)
    63. (FileInputStream)输入字节流
    62. File类常用方法
    61. File类
    60. 枚举
    快速排序
    归并排序
    初级排序算法
  • 原文地址:https://www.cnblogs.com/littlewriter/p/6667355.html
Copyright © 2011-2022 走看看