HTML/XHTML:More basic tags

From virtualMV2015wiki
Jump to: navigation, search
 Home  HTML/XHTML <

Formatting tags

Text can be formatted using the following tags;

  • The <p> tag is used to create a new paragraph
  • The <br /> tag specifies a line break between blocks of text. Although there are variations of the br tag, (<br>,</br>) get use to the XHTML format of <br /> )
  • The <pre> ... </pre> tag is useful for formatting text where white space is important (where spaces are to be included).
  • The <div> ... </div> tag is useful for formatting a block of text, and is commonly used with style sheets.
  • Alignment (left, center, right) can be achieved using the container tag align, for example align = "center" (Though this really should be done via a style)
<html> 
<head> 
<META NAME="keywords" CONTENT="html, htm, first page">
<META NAME="description" CONTENT="First web page">
<title>**’s first page</title>
</head> 
<body>
<h1>**’s web</h1>
<p>Hello <b>world</b></p>
<h2>Favourite quotes</h2>
<p>Live long and prosper</p>
<p>To be, or not to be .....<br />that is the question.</p>
<p>Et tu Brutus.</p>
<pre>     **space the final frontier</pre>
<div align = right>position: left right out</div>
</body>
</html>

TASK: Add and edit the body of one.html as shown above .

Notes

  • All media elements such as text (including headings) and graphics are automatically left aligned
  • Traditionally text alignment has been achieved using a container tag (one attached to another tag). For example
    • <div style="text-align: center">, remembering to turn it off with </div>
    • <p style="text-align: right">, remembering to turn it off with </p>
    • <h2 style="text-align: center">, remembering to turn it off with </h2>
  • To center text (or other items on a page), you can also use the <center> and </center> tags. (Note: center is spelt the American way!). Using the <center> tag and the align attribute is today discouraged and being replaced (deprecated) by the use of Style Sheets. (Deprecated means "being phased out").
  • If bullet text is aligned the lines will be double spaced. (More on this later).

Lines (horizontal ruler)

A line can be inserted into the page by using the <hr> tag. For example

<hr width = "80%" size = "4" />



Where size = height of the line in pixels.

The hr tag can also be expressed in the number of pixels, For example

<hr width ="333" />



where 333 is the number of pixels across

If you want to add really flashy lines, you can include them as an image. For example create a line that is animated (this will be covered later).

L comet1.gif


Icon References.png References


HTML/XHTML:More basic tags. (2017). In virtualMV's ( Michael Verhaart ) wiki. Retrieved December 12, 2017, from http://www.virtualmv.com/wiki/index.php?title=HTML/XHTML%3AMore_basic_tags    (zotero)