Basic HTML Codes for Blog Design!

Hey Beauties! Welcome to the new and improve Little Beauty Bug! Today I'm going to be sharing my very first post in my new little design element of my blog. I've been wanting to share with my readers and viewers all about blog design and things you can do to help improve your blog. Hopefully this little element of my blog will help you improve your blogs or help you add things to your blog to make them even better. Tutorials and posts will range from very basic things, like this one, to very advanced more complicated tutorials. But I will try my best to explain them to the best of my abilities so that you can all understand what I'm talking about. If you have any suggestions for posts you want to see or need clarification on anything I talk about in any of these post's please feel free to leave a comment or contact me via my social media. 

Today's post is going to be very simple and very basic for anyone looking to use HTML Codes within there blog designs or there posts. I'll be showing you a variety of basic HTML Codes that are commonly used when doing a blog design or post design. These certainly are not all the HTML Codes that can be used, these are just some of the basic one's I have personally used previously in web design as well as on this blog when it comes to my blog design and post designs. Here are some of those codes:

TEXT EFFECTS: Bold Text: Make your text stand out be increasing its font weight and making it bold and dark. Here is the code: <b>Text Here<b>
Italic Text: Make your text stand out by making it slanted or leaning to one side (italic). Here is the code: <i>Text Here</i>
Underlined Text: Make your text stand out by adding an underline underneath of it. Here is the code: <u>Text Here</u>
Strike-through Text: Make your text stand out by putting a line through the center of the text. Here is the code: <s>Text Here</s>
Centering Text: Make your text centered in your posts or on your page by adding the code below around the text you want to be centered. Here is the code: <center>Text Here</center>

Line Separator: Put a space between lines of your text by adding the following code. You can also add multiple spaces between your lines of text. Here is the code: <br />
Paragraphs: If you want to write a paragraph use the following code. This code also allows you to separate your paragraphs by using multiple of these codes one after the other on new lines. Here is the code: <p>Text Here</p>
Aligned Paragraphs: If you want to align the text in your paragraph you can use the code below. You can change the purple text to left or right depending on how you want to align the text. Here is the code: <p style="text-align:center">Text Here</p>
Headings: If you want to make certain areas of your text stand out as headings you can incase them in the following code. You can go from <h1> to <h6> with the higher the header number the smaller the text gets. An example is posted below. Here is the code: <h1>Text Here</h1>

Aligned Headings: If you want to add a header to your post or webpage and want it to be aligned use the code below and change the purple text to left or right depending on where you want your text to be aligned. Here is the code: <h1 style="text-align:center">Text Here</h1>

FONT EFFECTS: Font Size: Change the size of your font using the code below. Here is the code: <span style="font-size:16px;">Text Here</span>

Font Color: Change the color of your font using the code below, change the '#030303' code with any other color code to change the color of the text. Here is the code: <span style="font-color:#030303;>Text Here</span>
Highlighted Text: Add a highlighter background to your text using the code below, change the '#C2F2CA" code with any other color code the change the color of the highlight. Here is the code: <span style="background-color:#C2F2CA;">Text Here</span>

LINK CODES: Basic Link Code: Add a link to your blog or web page using the code below. Here is the code: <a href="URL GOES HERE">Text Here</a>
Open Link in New Tab: Add a link to your blog that opens up in a new tab on your web browser. Here is the code: <a href="URL GOES HERE" target="_blank>Text Here</a>

IMAGE CODES: Basic Image Code: Add an image to your blog or web page using the following code. Here is the code: <img src="IMAGE CODE HERE" alt="describe the image here"/>
Image as a Link: Add an image to your blog or web page that is a link to another page using the code below. Here is the code: <a href="URL GOES HERE"><img src="IMAGE CODE HERE" alt="describe the image here"/></a>
Image Link Open in New Tab: Add an image as a link to your blog or web page that opens in a new tab in your web browser using the code below. Here is the code: <a href="URL GOES HERE" target="_blank"><img src="IMAGE CODE HERE" alt="describe the image here"/></a>
Image Height & Width: Change the overall size of an image using the code below. Change the '450' and '600' to change the overall size of the image. Here is the code: <img src=|IMAGE CODE HERE" alt="describe the image here" width="450" height="600"/>