Help with making graphics responsive

Hi,
I’m working on a website that has a random image show up on the home page each time you load it. Currently the image is distorted because of sizing. I’d like to apply background:cover to make them appear normal.

I think that in the php code the image has to be identified as a background image?

Here is the code, Is there a way to use these images as backgrounds?
Thank you so much!!

<?php
/**
* @since ming 1.0.0
**/
get_header(); ?>
<div id=”content”>
<div id=”slideshow”>
<?php
$bg = array(‘b1.jpg’, ‘b2.jpg’, ‘b3.jpg’, ‘b4.jpg’); // array of filenames

$i = rand(0, count($bg)-1); // generate random number size of the array
$selectedBg = “$bg[$i]”; // set variable equal to which random filename was chosen
?>
<img src=”http://expertopinions.info/wp-content/uploads/2014/04/&lt;?php echo $selectedBg; ?>” class=”bgM”/>
<?php // image-only approach <img id=”hp-tagline” src=”http://www.expertopinions.info/wp-content/uploads/2014/07/TheBest_Titile_01.png&#8221; />
?>
<div id=”hp-tagline-wrap”>

</div>
<div class=”container”>
<div id=”minisidebar” class=”col minisidebar”>
<?php get_sidebar(‘left’); ?>
</div>

</div>
</div>
</div><!– content –>
<div class=”clear”></div>
<style>
#footer{display:none;}
</style>
<?php get_footer(); ?>