zoukankan      html  css  js  c++  java
  • background-attachment背景关联

    background-attachment背景关联

    • 设置背景图像是否固定或者随着页面的其余部分滚动
    • scroll背景图片随页面的其余部分滚动,这是默认;
    • fixed背景图像是固定的;
    • inherit指定background-attachmentI的设置应该从父元素继承
     1 <!DOCTYPE html>
     2 <html>
     3 <head>
     4 <meta charset="utf-8">
     5 <title></title>
     6 <style style="text/css">
     7 *{
     8 margin: 0;
     9 padding: 0;
    10 }
    11 .banner1,.banner2,.banner3{
    12 width:100%;
    13 height:800px;
    14 background-repeat: no-repeat;
    15 }
    16 .banner1{
    17 background: url(https://mobike.com/cn/assets/themes/moby/img/landing/hero-bg-3.jpg);
    18 }
    19 .banner2{
    20 background: url(https://mobike.com/cn/assets/themes/moby/img/landing/hero-bg-6.jpg);
    21 background-attachment: fixed;
    22 }
    23 .banner3{
    24 background: url(https://mobike.com/cn/assets/themes/moby/img/landing/hero-bg-7.jpg);
    25 }
    26 </style>
    27 </head>
    28 <body>
    29 <div class="banner1"></div>
    30 <div class="banner2"></div>
    31 <div class="banner3"></div>
    32 </body>
    33 </html>
  • 相关阅读:
    bzoj1081 [SCOI2005]超级格雷码
    bzoj3790 神奇项链
    bzoj2822 [AHOI2012]树屋阶梯
    bzoj1485 [HNOI2009]有趣的数列
    bzoj1486 [HNOI2009]最小圈
    bzoj2721 [Violet 5]樱花
    POJ 1238 Substrings
    ZOJ Team Formation
    POJ 1459 Power Network
    POJ 1458 Common Subsequence
  • 原文地址:https://www.cnblogs.com/webaction/p/13903280.html
Copyright © 2011-2022 走看看