HTML/Bouton zoom

Page d'exemple avec l'image suivante File:logo kono phil.svg
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Test image animée</title>
    <style>
      h1 {
          background: #44f;
          color: white;
          padding: .25em;
      }

      #logo, #bouton {
          display: flex;
          justify-content: center;
          flex-direction: row;
          flex-wrap: wrap;
      }

      #logo {
        margin: 2em 0;
      }

      #bouton > div {
          margin: 10px;
      }

      .google, .glpi, .konoburo {
          box-sizing: border-box;
          transition: transform .2s;
          padding: 0 1em;
          transform: scale(0.95); 
      }

      .google:hover, .glpi:hover, .konoburo:hover {
          transform: scale(1); 
        }

      img {
        width: 180px;
      }
      .google, .glpi, .konoburo {
        width: 210px;
      }
    </style>
  </head>
  <body>
    <h1>Bouton avec image zoomée au survol</h1>
    <div id="logo">
      <div><a href="#""><img src="img/logo kono phil.svg" /></a></div>
    </div>
    <div id="bouton">
      <div class="google"><a href="#""><img src="img/logo kono phil.svg" /></a></div>    
      <div class="glpi"><a href="#""><img src="img/logo kono phil.svg" /></a></div>
      <div class="konoburo"><a href="#""><img src="img/logo kono phil.svg" /></a></div>
    </div>
  </body>
</html>
HTML/Bouton zoom

Menu de navigation
