Edit in JSFiddle 

<!doctype html>
<html>

  <head>
    <title>CSS text/image align</title>
    <style>
      h2 {
        text-align: center
      }

      .img-middle {
        vertical-align: middle;
        margin: 10px;
      }

      .img-top {
        vertical-align: top;
        margin: 10px;
      }

      .img-bottom {
        vertical-align: bottom;
        margin: 10px;
      }

    </style>
  </head>

  <body>
    <h2>CSS text-image align</h2>
    vertical-align:top <img class="img-top" src="http://via.placeholder.com/50x50"><br> vertical-align:middle <img class="img-middle" src="http://via.placeholder.com/50x50"><br> vertical-align:bottom <img class="img-bottom" src="http://via.placeholder.com/50x50"><br>
  </body>

</html>