Beginner's Guide to XHTML
Wednesday 22nd June 2005 - Saturday 7th January 2006
Categories: Guides, Internet, Code
Changing Appearance
In XHTML, there are various tags that can be used to changed the appearance of text. Although using style sheets and <span> tags is a better idea in some cases, these tags are still allowed, and some are extremely useful. <span> tags will be covered in due time, but these tags are still useful if you want to highlight something quickly.
The following table shows a multitude of tags that can be used in XHTML to change the text. For example, in this guide, I have been using the <code> tags when I have been writing code. Some tags are better than others. If a tag is a description of appearance, such as bold or italic, then it isn't particularly wise to use. On the other hand, tags that describe their purpose, such as emphasis, are much better, since this they are not presentational descriptions, but rather semantic descriptions.
If you're wondering why this is important, it is because XHTML should be used to describe the content of a webpage, not its appearance. So, you can say what bits are headings, paragraphs, quotes, code, definitions, etc., since these show the structure and actual content of the page. You should avoid presentational tags, such as bold, italics, etc., since these do not convey any sort of meaning as to the content of the page.
| Opening Tag | Description | Example |
|---|---|---|
<b> |
Makes the text between the tags bold | This text is bold |
<i> |
Makes the text between the tags italic | This text is italic |
<big> |
Enlarges the text between the tags | This text is enlarged |
<em> |
Emphasises the text between the tags | This text is emphasised |
<small> |
Makes the text between the tags small | This text is small |
<strong> |
Makes the text between the tags strongly emphasised | This text is strongly emphasised |
<sub> |
Makes the text between the tags subscript | Normal Subscipt |
<sup> |
Makes the text between the tags superscript | Normal Superscript |
<code> |
Makes the text between the tags appear as computer code | This text is code |
<dfn> |
Makes the text between the tags a definition | This is a definition |
<kbd> |
Makes the text between the tags keyboard text e.g. input text when using a program | This is keyboard text |
<pre> |
Makes the text between the tags preformatted | This text is preformatted |
<samp> |
Makes the text between the tags sample output e.g. from a program | This text is sample output |
<tt> |
Makes the text between the tags teletype text | This text is teletype |
<bdo dir="ltr"> |
Changes the text direction to left to right | Left to right |
<bdo dir="rtl"> |
Changes the text direction to right to left | Right to left |