html - how to give spacing between these images -

i have put 6 images in rectangle form 1 kept next

all images car mobile , all. want see them amount of space between them,because want hover , other stuff on images various categories , images needs little separated(for better ui).my div section covers blue area see having categories inside them :

<div class="jumbotron">    <h1>categories</h1>          <p>             <img class="book" src="book_main.jpg" alt="book face" style="float:top;width:150px;height:130px" href="">               <img class="mobiles"src="mobile_main.jpg" alt="mobiles face" style="float:left;width:150px;height:130px" href="">               <img class="vehicles"src="vehicle_main.jpg" alt="vehicles face" style="float:left;width:150px;height:130px" href=""><br>               <img class="animals"src="animals_main.jpg" alt="animals face" style="float:left;width:150px;height:130px" href="">               <img class="jobs"src="jobs_main.jpg" alt="jobs face" style="float:left;width:150px;height:130px" href="">               <img class="furniture"src="furniture_main.jpg" alt="furniture   face" style="float:left;width:150px;height:130px" href=""><br>          </p>   </div> 

and other style sheet using here bootstrap.min.css(for jumbotron ,available on link :http://getbootstrap.com/). how give spacing ?any ideas?

css margin property this.

you can try this:

img{      margin:10px;  }

<div class="jumbotron">     <h1>categories</h1>           <p>              <img class="book" src="http://i.stack.imgur.com/ctyef.jpg?s=128&g=1" alt="book face" style="float:top;width:150px;height:130px" >                <img class="mobiles"src="http://i.stack.imgur.com/ctyef.jpg?s=128&g=1" alt="mobiles face" style="float:left;width:150px;height:130px" >                <img class="vehicles"src="http://i.stack.imgur.com/ctyef.jpg?s=128&g=1" alt="vehicles face" style="float:left;width:150px;height:130px"><br>                <img class="animals"src="http://i.stack.imgur.com/ctyef.jpg?s=128&g=1" alt="animals face" style="float:left;width:150px;height:130px" >                <img class="jobs"src="http://i.stack.imgur.com/ctyef.jpg?s=128&g=1" alt="jobs face" style="float:left;width:150px;height:130px" >                <img class="furniture"src="http://i.stack.imgur.com/ctyef.jpg?s=128&g=1" alt="furniture   face" style="float:left;width:150px;height:130px" ><br>           </p>    </div>

demo here