Resizing a blob image from MySQL database in php, then create div for it

So, saying that I'm new to php would be an understatement. Nevertheless, I've managed to rig up something to inject mySQL blob data into background-image attributes of divs. I am going to be expanding this to have 3 image for each piece of jewelry, but that would still work for this. The problem comes because I will have to have small icons for each picture (2 icons for the first picture). What would be an effective way to resize the images to jive with the way I'm doing it now (creating a div around it), or is there a better way to do this to allow for the size changing? I've looked at other questions on the topic, but tend to get confused on how to make it work with my intentions.

<?php
$servername = "localhost";
$username = "username";
$password = "";
$dbname = "db"; //Obviously, this data is changed

$mysqli = NEW mysqli($servername, $username, $password, $dbname);
$resultset = $mysqli->query(
   "SELECT * FROM items WHERE category = 'jewelry'");

if($resultset->num_rows != 0){
   while($rows = $resultset->fetch_assoc()){

      $name = $rows['name'];
      $price = $rows['price'];
      $pic1 = $rows['pic1'];

      echo "
        <div class='invitem' style='background-image:url(
        data:image/gif;base64,".base64_encode($pic1).");'>
          <h1>$name</h1>
        </div>";
    }
} else {echo "No Results Found";}
?>

EDIT: This may be too late, but by resize, I mean compress.