HTML Coding – 2

Last time, we learnt about the very basic tags that should be used in order to create an HTML webpage. If you missed those, I recommend to read the previous post by clicking here.
If you want to read the next part, then click here and know the next steps.
This time we will consider the tags to make our website a lot more attractive in the text area.

STARTING UP


At times, you just can’t keep typing the text all in one place like a bunch of paragraphs all stacked together without any spaces or gaps between them. Right? In HTML also, we need to provide some gaps between different paragraphs.
For example, here is a piece of code:



when you run this code, you can expect that the code would be like:


But then you decide to give space and make this in three different paragraphs and then you’ll try doing something like this to your code in hope it would work:



But sadly, when you run it, it would be exactly the same again:



So how do you even add spaces and make text more appealing?

To do this, we use a tag – <br>  which can be a mnemonic for break. With this tag you can leave lines and go to the next one.

For instance on using this tag in the previous tag, we get:

It looks like the following:


So we got the breaks, but not actually looks as if we skipped and made it more clear. How to do that? Well you might be right in this case. The answer is to add it multiple times.

Lets do it and test if it works. We’ll add two instead of one:


And this results it:

Now it looks better. Let us try to use more tags and update this content in a far better way. 

ADDING THE THREE TYCOONS

There are some specials words and phrases that the user would want its reader to have special attention towards. In that case, as being the most easy as simplistic, Bold, Italics and Underline come in handy.

To apply bold, use the <b> tag where you want to start and the place where you want to end the bold effect, use </b>

Similarly, to apply italics, use the <i> tag where you want to start and the place where you want to end the italics effect, use </i>.

And again, to apply underline, use the <u> tag where you want to start and the place where you want to end the underline effect, use </u>.

Let us try and code it on and understand it by our practical method:

This results in the following case:


So I’m sure you learnt one more thing – making subsequent tags and making them embedded in one other. Not to be confused about embedded content in HTML, which is another term and a story for another time.

QUICK TIP: Always make sure you have proper endings of the tags at required places.

In The Next Part, we’d look forward to formatting, coloring and creating attractive content that anyone would love to read.

MORE TO DO…

Now that you have learnt it, go ahead and try some of your own coding. For assignment you can create the following:

  • Defines some terms and its meanings, it can be words or anything.
  • Use the bold effect in the term and use italics in the definition of it.

If you created one of the above web pages, congrats! You can share them along with me – send me using email at – muditjhawar[at]gmail[dot]com and get featured in the next post.

Subscribe to the blog (use the widget in the sidebar) to make sure you don’t miss any post! Also, share along with your coding buddies!!

By best wishes are with you! 🙂

 

Leave a Reply