CSS Goodies

Gradient backgrounds

            
              .basic-gradient {
                background: linear-gradient(blue, pink);
              }
            
          

• CSS Gradient Generator
• MDN's Using CSS gradients

Sticky items!

            
              div {
                position: sticky;
                top: 20px;
              }
            
          

Intro to transition property

            
              p {
                color: red;
              }

              p:hover {
                color: blue;
                transition: color 1s;
              }
            
          

Intro to transform property

            
              img {
                display: block;
                height: 200px;
                width: 200px;
              }

              img:hover {
                transform: scale(1.5);
              }