Pure CSS Parallax

Lorem ipsum dolor sit amet consectetur adipisicing elit. Et, beatae iste doloremque unde nam harum alias est. Eius, molestiae voluptates aliquam ipsa eligendi vel recusandae pariatur at natus obcaecati fuga.In eum dolorem neque, iure quae cum nihil fugiat quasi voluptatum optio. Sint nemo et vero cum, similique unde incidunt assumenda deleniti natus temporibus vel tempora nobis tempore ut quibusdam!


                <div class="parallax">
                    <div class="parallax-content">
                        <h1>Pure CSS Parallax</h1>
                    </div>
                </div>
        

                html{
                    height: 100%;
                    overflow: hidden;
                }
                  
                body{ 
                    margin:0;
                    padding:0;
                    perspective: 1px;
                    height: 100%;
                    overflow-y: scroll;
                    overflow-x: hidden;
                }
                
                 .parallax {
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    height: 100%;
                    width: 100%;
                    transform-style: preserve-3d;
                    background-image: url("dream-dog.jpg");
                    background-position: center;
                    background-size: cover;
                    z-index:2;
                  }
                
                  .parallax-content {
                      transform: translateZ(.25px) scale(.75);
                     }
        

Pure CSS Parallax