HTML More Text

In the last lesson, you learned about different tags that will change the “font” of your text. In this lesson we will look at more tags that will change the way a text acts or looks.


Making Paragraphs

In the last lesson, I said that the paragraph text ignores any line breaks that you make. This means that you weren’t able to break a passage of text into separate paragraphs. But what if you really want to break it into paragraphs?

The answer is quite sinple. All we do is form new <p> tags for every paragraph.

Example:

<p>Forming paragraphs is quite sinple. All you have to do is to make different paragraph tags for every paragraph you want to make.</p>
<p>This is an example of a paragraph text. As you can see, there are two paragraphs here.</p>

Result:

Forming paragraphs is quite sinple. All you have to do is to make different paragraph tags for every paragraph you want to make.

This is an example of a paragraph text. As you can see, there are two paragraphs here.

Bold/Strong

If you want to make a word bold, then you can either add the bold tag or the strong tag, which are <b> and <strong> respectively. In the last lesson, you created a website already, so we will go from there. This is the code that you should already have:

<html>
  <head>
    <title>My First Website!</title>
  </head>
  <body>
    <h1>My First Website</h1>
    <p>Hello! Welcome to my first website. This is written in HTML. </p>
    <h2>What is HTML?</h2>
    <p>HTML is a "language that is used to create basic pages for building 
       websites. </p>
  </body>
</html>

Now, lets say that in the first paragraph text, you want to make the word “Welcome” bolded. We can either add a bold tag or a strong tag, but let’s just use the bold tag for this lesson. Try to add it in.

<html>
  <head>
    <title>My First Website!</title>
  </head>
  <body>
    <h1>My First Website</h1>
    <p>Hello! <b>Welcome</b> to my first website. This is written in HTML. </p>
    <h2>What is HTML?</h2>
    <p>HTML is a "language that is used to    create basic pages for building 
websites. </p>
  </body>
</html>

Now, save it again and open it.


Italic/Emphasize

If you wanted to italicize a text, you would use the italic tag which is <i>, or the emphasize tag, which is <em>. In your website, try to add italic tags to italicize the paragraph text “basic pages”

Answer:

<html>
  <head>
    <title>My First Website!</title>
  </head>
  <body>
    <h1>My First Website</h1>
    <p>Hello! <b>Welcome</b> to my first website. This is written in HTML. </p>
    <h2>What is HTML?</h2>
    <p>HTML is a "language that is used to create <i>basic pages</i> for building 
websites. </p>
  </body>
</html>

Save it and open it. Again make sure the file name ends with .html


Insert/delete

The <ins> tag indicates that something has been inserted, while the <del> tag indicates that something has been deleted. This is commonly used on google drive when someone suggests changes to a document. The insert tag is underlined while the delete tag makes a text have a line through it.

Using the website you created, try to insert the word “Awesome” between the words “First” and “Website” in the h1 tag. Next, use the delete tag to “delete” the sentence “This is written in HTML.”

Answer:

<html>
  <head>
    <title>My First Website!</title>
  </head>
  <body>
    <h1>My First <ins>Awesome<ins> Website</h1>
    <p>Hello! <b>Welcome</b> to my first website. <del>This is written in HTML. </p>
    <h2>What is HTML?</del></h2>
    <p>HTML is a "language that is used to create <i>basic pages</i> for building 
websites. </p>
  </body>
</html>

The <s> tag looks the same as the <del> tag, but they mean different things. The difference is that the<del> tag indicates that you want to delete a text that was in the document before, whereas the <s> tag indicates that the information is no longer true or relevant.

The following two tabs change content below.
Profile photo of Christopher
Christopher Chang is the founder of BlokkyWeb and content writer and main designer for BlokkyWeb.
Profile photo of Christopher

Latest posts by Christopher (see all)

Profile photo of Christopher

Christopher

Christopher Chang is the founder of BlokkyWeb and content writer and main designer for BlokkyWeb.

Leave a Reply

Support us!

If you like this site and want to support Christopher Chang please like our facebook site!