Computers 4 you!: HTML Formatting

HTML Formatting

As you may have seen already, there are many ways to format text in HTML. Besides paragraphs, here are two main commands for managing text in block form.

pre - Used to direct the browser to display a section of text exactly as it is typed with spaces included.
blockquote - Used to format a block of text as a long quote indented more than the surrounding text on the left and the right.

The PRE element

PRE element attributes

WIDTH="20" - (Depreciated). The WIDTH attribute specifies the number of characters across the screen to display. This is very rarely used.

PRE element example

The PRE element is handy for showing program code or part of file content as in this example. This is the HTML code:

Edit the file "/etc/auto.misc" adding lines like:

<pre>

      cd       -fstype=iso9660,ro     :/dev/cdrom

      fl       -fstype=auto           :/dev/fd0

</pre>

This is how it looks:

Edit the file "/etc/auto.misc" adding lines like:

      cd       -fstype=iso9660,ro     :/dev/cdrom

      fl       -fstype=auto           :/dev/fd0

The BLOCKQUOTE element

This element may contain other block elements such as headers , paragraphs, preformat blocks and tables. It should not be contained inside a paragraph element. It should not be used to produce indentation. Style sheets should be used possibly with the CLASS attribute to create indentation. Attribute:

cite="uri" - Specifies the URI of the source of the quote.

OCKQUOTE element example

This is the HTML code:

The preamble of the Constitution says: 

<blockquote>
We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.
</blockquote>

This is how it looks:

The preamble of the Constitution says:

We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.

The following code will produce the same effect using style sheets. In the HTML file:

The preamble of the Constitution says: 


We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.

In the style sheet:

.indent { margin-right: 5%; margin-left: 5%; color: #0000ff }