HTML Text Styling by G Krishna Chauhan

In this lecture we are discussing about the HTML Text Styling.

Paragraphs:

Go back to notepad and .............try to do this ........ .
<html>
<head>
<title>first web page</title>
</head>
<body>
This is my first web page How exciting
</body>
</html>

Look at the document in your browser.
You might have expected your document to appear as you typed it, on two lines, but instead you should see something like:
This is my first web page How exciting.

This is because web browsers don't usually take any notice of what line your code is on . It also doesn't take any notice of spaces (you would get the same result if you typed 'This is my first web page How exciting').If you want text to appear on different lines, you need to explicitly state that.

Change your two lines of content so that they look like this:
<p>This is my first web page</p><p>How exciting</p>

The p tag is for 'paragraph'.
The two lines will now appear on two lines.The HTML content should be seen just like a book - with paragraphs where appropriate .

Emphasis:

You can emphasise text in a paragraph using em and strong. These are two
ways of doing pretty much the same thing, although traditionally, browsers
display em in italics and strong in bold.


<p>Yes, that <em>is</em> what I said. How <strong>very</strong>exciting.</p>

Line breaks:

The line-break tag can also be used to separate lines like this:
This is my first web page<br />
How exciting .
However, this method is over-used and shouldn't be used if two blocks of  text are intended to be separate from one another.
(Because nothing appears between the line-break tag, there is no closing tag
and it closes itself with a '/' after the 'br').

Headings:

The p tag is just the start of text formatting.
If you have documents with genuine headings, then there are HTML tags specifically designed just for them.
They are h1, h2, h3, h4, h5 and h6, h1 being the almighty emperor of headings and h6 being the lowest pleb.

Change your code to the following:


<html>
<head>
<title>My first web page</title>
</head>
<body>
<h1>My first web page</h1>
<h2>What this is</h2>
<p>A simple page put together using HTML</p>
<h2>Why this is</h2><p>To learn HTML</p>
</body>
</html>
Note that the h1 tag is only used once - it is supposed to be the main heading of the page and shouldn't be used multiple times.




h2 to h6 however, can be used as often as is desired, but they should always be used in order, as they were intended. For example, an h4 should be a sub-heading of an h3, which should be a sub-heading of an h2 .







No comments:

Post a Comment