Formatting Text in XHTML

Posted Apr 03, 2009 by Chrys / comments 0 comments / Print / Font Size Decrease font size Increase font size

In this article, you learn how to format text in XHTML.

XHTML Basics - Part 5

Introduction
Formatting text refers to the ways of presenting text. For example, you may want to have text underline or bold. When you are writing a poem, you would want to put text in particular position on the line of the page; this is also a case of formatting.

Note: If you cannot see the code or if you think anything is missing, just contact me at forchatrans@yahoo.com. That is, contact me for the slightest problem you have about what has been typed.

Formatting text with XHTML
You can do limited formatting with XHTML. You are not even advised to do serious formatting with XHTML. If you think that your web page needs a lot of formatting (presentation), use what is called Cascaded Style Sheet. Cascaded Style sheet will not be covered in this series. Everything being equal, I will teach you that in a different series. What I give you in this part of the series, is what you can use to format text using XHTML. If you want more power, you would have to use Cascaded Style Sheet.

Characters of Text
Try the following Code (save and open in browser).

This text is bold


This text is big


This text is strong


This text is small


This text is italic


This text is emphasized


This text is subscript


This text contains superscript



What interest us here, is what is in the Body element of the web page code. There are eight lines in the Body element. I assume that you have tried the code.

In your browser, you should see the first line bold. To bold text, use the B tag pair as follows:

This text is bold

If you look at the code, you would notice that after each of the eight lines you have a pair of line-break elements. The first line-break element of the pair, forces anything on its right to the next line at the browser. The second line break element forces anything that is to appear on its right to the next line. Since there was nothing on its left, a new line is created below the previous line of text at the browser. The other pairs of line break elements behave in the same way. Let us continue with text formatting.

Look at the second line at your browser. It is like Bold, but they call it BIG. It has more weight than Bold. We saw the B element tags above. The BIG element tags or syntax is:

This text is big

All the elements in the Body element are double tag elements. The rest of the elements in the Body Element are:

This text is strong

This text is small

This text is italic

This text is emphasized

This text is subscript

This text contains superscript

The best way to appreciate what these elements are is to look at the display of the web page and then look at the corresponding tag pair above.

The PRE Element
Remember that if you type more than one consecutive space in your text editor, the browser will reduce them to one. There is an element called the PRE element, which is a double tag element. If you type more than one space in this element, the browser will display the spaces. The Spacebar key is respected within this element; that is, if you press the Spacebar key while typing in your text editor, the browser will respect it and display a number of spaces equal to the number of times you pressed the key. This is an exception, because pressing the Spacebar Key more than once has no effect at the browser within any other element. The following code shows the PRE element with text inside your text editor.


love
love love love
love

love
love love love
love


Inside the PRE element above, you have the word, “love”, repeated in a pattern. Now, because all that is in the PRE element, the browser will display it as you have typed in the PRE element. The browser will display it as follows:

love
love love love
love

love
love love love
love

The DEL element
The DEL element draws a line across text. Consider the following code:

The cost has been reduced from

$500 to 400.

The DEL element encloses “400” in the code. The DEL element is a double pair element. The browser will draw a line across 400.

Conclusion
We have looked at some XHTML formatting tags in this part of the series. There are other formatting tags. However, if you want more formatting than what this chapter gives you, you should use Cascaded Style Sheet. I do not cover Cascaded Style Sheet in this series.

Let us stop here and continue in the next part of the series.

Chrys

Rate this Article:

Be the first to rate me.

  • Nothing Found!

    Why not submit your own content? Signup here.


* You must be logged in order to leave comments, please login or join us.

Comments

No comments yet.



Bookmark and Share
Sign up for our email newsletter
Name:
Email: