sans que l’image ne perde son ratio
dépassement de l’écran (ni verticalement, ni horizontalement), donc s’affichant au maximum à l’écran.
sans sur-zoomer l’image
sans JavaScript

HTML, CSS :

  

    
  

#d1 {/* dans le cas d’une lightbox, j’ai ça pour pas que ça dépasse de l’écran */
   position: fixed;
   top: 5%; right: 5%; bottom: 5%; left: 5%;
}

#d1 div img {
   max-width: 100%; max-height: 100%;
   width: auto;
   height: auto;
}

#d1 div {
   width: 100%; height: 100%;
   display: inline-block; /* lui il est important */
}