How To Format Text In HTML

Now you know how to create a HTML page with the basic setup.
So now it is time to add your very own style to your site, first we will start off with easy coding like formatting text then we will move onto harder coding like HTML tables and lists.

Tags for formatting text

There are allot of tags for formating text in HTML, but first you need to know, web browsers count all spaces as ONE and enter(new lines) as ONE space. ie. 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html>
<head> 
<title> My first home page title </title> 
</head>  
<body>

Welcome to your     first 

webpage

</body>
</html>
This code would produce:

Welcome to your first webpage

You must use tags to make new lines. Also you should use the paragraph tag (as shown below).

Paragraph tag

The paragraph tag is used to declare where a paragraph of text is. eg. 
<p>HTML is the best code on the web for making web pages.</p>
This code would produce:

HTML is the best code on the web for making web pages.


Well that was easy enough, and text formatting does not get any harder.

Line Breaks

Line breaks are used to stop the current line and start the text on the next line. eg. 
<p>HTML is the best code on the web <br> for making web pages.</p>
This code would produce:

HTML is the best code on the web
for making web pages.


No closing tag? No there is no closing tag for the <br> tag. This is because it does not need to wrap around anything.

Emphasized and bold text

There will come a time where you need to make some text stand out. The best tags to do this are: <em> and <strong> The format for these tags is; <em>Emphasized text</em> and <strong>Bold text</strong>. eg. 
<p>HTML is the <em>best</em> code on the web for <strong>making</strong> 
web pages.</p>
This would produce:

HTML is the best code on the web for making web pages.

Comments

Comments are only used by humans and are hidden from view when published(you can view a comment in the source code). They can be used to hide code and leave notes for later, or simply state where you are in your HTML code. The syntax for a comment is: <!-- Comment --> eg.
<!-- This is a hidden comment,
 <em>It has tags in it</em> - but they will not be shown. -->
<p>HTML is the best code on the web for making web pages.</p>
This would produce:

HTML is the best code on the web for making web pages.


As you can see comments are not shown, and they can be used on multiple lines.

Tips:
  • Use &nbsp; to create more spaces then one
  • To make text stand out use <em> and <strong> tags
  • To make line breaks use the <br> tag
  • Always use the <p> tag when using text


In the next section of this beginner HTML tutorial you will learn how to create HTML headings.
Next page: HTML Headings
Back: Beginner HTML tutorial: Index