css实现悬浮手风琴图片放大展示效果代码-html代码-BFW代码库

css实现悬浮手风琴图片放大展示效果代码

代码语言：html

代码描述：css实现悬浮手风琴图片放大展示效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!doctype html>
<html>

<head>
    <meta charset="utf-8">

    <style>
        html, body {
          width: 100%;
          height: 100%;background-color: #1F1F1F;
        }
        
        .container {
          padding: 75px 0;
          margin: 0 auto;
          width: 1140px;
        }
        
        h1 {
          position: relative;
          margin-bottom: 45px;
          font-family: "Oswald", sans-serif;
          font-size: 44px;
          text-transform: uppercase;
          color: #424242;
        }
        
        .gallery-wrap {
          display: flex;
          flex-direction: row;
          width: 100%;
          height: 70vh;
        }
        
        .item {
          flex: 1;
          height: 100%;
          background-position: center;
          background-size: cover;
          background-repeat: none;
          transition: flex 0.8s ease;
        }
        .item:hover {
          flex: 7;
        }
        
        .item-1 {
          background-image: url("//repo.bfw.wiki/bfwrepo/image/6257e71d9a53f.png");.........完整代码请登录后点击上方下载按钮下载查看