Chapter 3: Text
Text is what makes up a lot of most websites. It's what your reading right now. And in this chapter we will be exploring how to make them. First of all think of this as a word document, or a Newspaper article. It always has a Header, and the text. In some cases a sub-header. Now we are going to cover different type of headers. Size matters when creating paragraphs and titles for example there are six different types of headers in HTML. Text and headers are known as tags. Elements was the other stuff like <body> and etc. These are now tags that go inside the body. So inside the body tag we are going to make a header first. Header like most tags is its starting letter so h. then add the number of which type it is so h1. Then define that it is a tag and close it off with <h1></h1>. h1 is the biggest header well h6 is the smallest, then you put the text you want in between like this. <h1>This is a H1 Header</h1> I'll show you below. (ignore the fact that h2 is green, yours wont be)
This is an h1 Header
This is an h2 Header
This is an h3 Header
This is an h4 Header
This is an h5 Header
This is an h6 Header
h1 is used for Main Headings. h2 is used for Sub-Headings. If there are other sub-headings then <h3> and others are used. Let's now add a Heading to our website, so under the body tag add a <h1> heading and name it whatever the paragraph we make is going to be about. Remember to end the tag with </> or in this case </h1> . Again like most tags, the tag is the starting letter. So go a line down and use p for paragraph and make it into a tag. Then end it. Now in between the starting tag and the closing tag, write your paragraph. Now below the paragraph tag should be the ending of the body tag, your code should look like this:
<!Doctype html>
<html>
<title>This is an example website</title>
<head>
</head>
<body>
<h1>This is the Header to my paragraph</h1>
<p>This is my paragraph, because it is a paragraph tag it will auto indent down when needed</p>
</body>
</html>
<html>
<title>This is an example website</title>
<head>
</head>
<body>
<h1>This is the Header to my paragraph</h1>
<p>This is my paragraph, because it is a paragraph tag it will auto indent down when needed</p>
</body>
</html>
Now save and double click your .html file. It should now look like this: I have highlighted some areas to represent what code does what.
TIP: