HTML Lesson No.5 – More on Formatting your Text

More on Formatting your Text

Hey! We’re really getting somewhere! By now I’ll bet that you’ve got a very informative page with a beautiful link to someplace (this site? please?! awww….) on it. That’s great, but I’ll bet you’re hungry to make it look even more beautiful than it already is (or maybe your boss demands it!). Well, read on!

Do you like your name to stand out on your pages? I do! On every page, i make sure that little v is in boldface. How did I do this? HTML has some special tags that allow us to change the way our text is shown. The one I just used is the <B> or boldface tag. You can also make the text in italics with the <I> or italics tag. Similarly, you can underline text with the <U> or underline tag. These tags need both an opening tag and a closing tag, so the format is <I, B, or U>text to be formatted</I, B, or U>.

In addition to these regular formatting tags, there are lots of special formatting tags. Heres a list of them

Special formatting tags
<SMALL> – Small text
<BIG> – Big text
 <SUPER> – Superscript
 <SUB> – Subscript
 <STRIKE> – Strikethrough text (text with a line through it)
 <TT> – Monospaced (typewriter style) text
 <PRE> – Preserves all format and line breaks in source HTML

Yep, text formatting is great! Now here’s how to align your text.

When you align your text, it lines up with that portion of the window. So left aligned text (the default)is lined up with the left side of the window just like using a word processor and clicking the left align button.

However, there is no align tag. What HTML has is what’s called an attribute. An attribute is an argument that is put into a tag to change the way that tag works. The align attribute can be put into many different tags to format paragraphs, or blocks of text (pictures too-more on this later). So if we wanted to make a paragraph aligned to the center of our window, we’d just add the align attribute to the <P> tag at the beginning of that paragraph. So it would look like this:

<P ALIGN=”center”>
Hi, this paragraph is aligned with the center. This was accomplished by using the align attribute.

There is also a way to format whole blocks of text. The way we do this is by using the <DIV>, or division tag. The division tag really doesn’t do anything without the align attribute. In fact, it’s useless with no attributes!

The <DIV> tag is used like this:

And here’s how it would show up in the browser window:

Hi, this paragraph is aligned with the center. This was accomplished by using the align attribute.

There is also a way to format whole blocks of text. The way we do this is by using the <DIV>, or division tag. The division tag really doesn’t do anything without the align attribute. In fact, it’s useless with no attributes!

The <DIV> tag is used like this:

<DIV ALIGN=”left”>
This is the text to be left aligned. <P> I can align lots of text with the division tag!
</DIV>

If we put this on our web page, it shows up in a browser like this:

This is the text to be left aligned.I can align lots of text with the division tag!

The align tag can also be used in headers. If you want your header to be eye-catching, align=”center” it!

All this stuff is great, but I bet you’re worried about the small margin space in your pages. Well, that can be fixed with one easy tag: the <BLOCKQUOTE> tag! Simply put a <BLOCKQUOTE> right under that <BODY> tag  and a </BLOCKQUOTE> right above the </BODY>, and you’ll have beautiful margins in your page with minimal work!

Now you should be an expert in text format and alignment. Take a few minute to absorb what you’ve just learned, and surf to the next lesson.

About Saurabh Patel
⚠ Hacking Is Art Like Magic🤗 》WhiteHat / BlackHat 🎩 》Bug Hunter 😋 》Cyber Security 😉 》Web Hacker 😎 》Security Researcher 😍 》Pentester 😜 》Blogger 👻

1 Comment

  1. […] HTML Lesson No.5 – More on Formatting your Text […]

    Reply

Your email address will not be published.