Set in gray and css website images add multiple background image to achieve

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>

<body>
  <div  class="bg" style="width: 100%;height: 1000px;">
    <!-- <img src="栈出.png">
    <img src="./u=264976548,648399195&fm=26&gp=0.jpg"> -->

  </div>
</body>

</html>
<style>
//添加多张背景图片
 .bg{
 background: url("栈出.png"),
 url("u=264976548,648399195&fm=26&gp=0.jpg");
 background-repeat: no-repeat,no-repeat;
 background-size: 190px,120px;
 background-position: 0 0, 280px 51px;
 }
//设置黑白色
  html {
    -webkit-filter: grayscale(100%);
    /* webkit */
    -moz-filter: grayscale(100%);
    /*firefox*/
    -ms-filter: grayscale(100%);
    /*ie9*/
    -o-filter: grayscale(100%);
    /*opera*/
    filter: grayscale(100%);
    filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
    filter: gray;
    /*ie9- */
    }
</style>

Here Insert Picture Description

Published 98 original articles · won praise 4 · views 20000 +

Guess you like

Origin blog.csdn.net/weixin_42416812/article/details/105309508