Okay so, someone requested for a tutorial.
Well, they didn't really request. It was more like, "Can you help me with this?"
And I was like, "Hey it can be a tutorial!"
So yeah.
Just thought it'd be nice to know.

In this tutorial, I am going to show you 2 different ways to do this. The tutorial after this is a more complex way of doing it so it was put into a separate chapter. So for this tutorial, we'll be using the < img src > tag. Don't worry, all this tag's use is for putting in images so no biggy there. So here's the first way! :D
**If copying my examples, don't forget to remove spaces after every "<" and before every ">" in order to get the code working properly.**

VERSION 1

Example: 
< img src="http://i1307.photobucket.com/albums/s587/MagicalDreams1/Icons/SakuraIcon12_zps87a9b454.png" style="width: 100px; height: 100px; border-style: solid; border-width: 20px; color: #2e2e2e;"/ >

You already know what border-style does and what it is so no point in explaining that. If not, the border-style is simply how you want the border to be. In this case, I kept the border to solid. Now, the border-width is what's making all of this black stuff around the image. I set the border-width to 20px and 20px it is. As for the color, I left it black but it's a lighter shade of black for some reason..

VERSION 2

Example: 
< img src="http://i1307.photobucket.com/albums/s587/MagicalDreams1/Icons/SakuraIcon12_zps87a9b454.png" style="width: 100px; height: 100px; border-style: solid; border-width: 1px; color: #ff9ca2; background-color: #212121; padding: 20px;"/ >

So once again, we use border-style and border-width. However, this time when use color, it only changes the color of the border. Use background-color to fill in the inside and DON'T FORGET padding. If you forget padding, you can forget about even having a box.

So the reason why these two tutorials are separated from the other one is because of the border. Do you see how at the corner's, they're round and not sharp and edgy? Well, the next tutorial will tell you how to make a box around your image WITHOUT having the round little corners. Heck, I'll just tell you now about why it does that. Do you notice how in the < img src > tag, there's the img src part with the link to the image right after, and then after the image link, there's something that says "style"? That's where we've been placing everything and well, placing it inside the "style" part of the < img src > tag automatically adds that round corner to it.

So that tells you a little bit about our next tutorial right? We're definitely not using the "style" part of our < img src > tag for that.

ALSO; important notice!

I've been wanting to revamp the shop and change the shop of the name but in order to do that, I actually need a name for this place. So! All I'm asking you to fill out this quick survey for me! :D It'll be short, I promise. :3 Click here!