There are six levels of headings, h1 is the most important and h6 is the least. Use the levels consistently throughout your site to give a logical hierarchy or outline to a document. Choose a heading based on its importance, not its visual size.
Paragraphs are the most rudimentary elements of a text document. They can contain text, images, or other inline elements. By default they add space below the closing tag. Most of the content of my page will be contained within a paragraph tag.
Notice the font that this is being shown in. It is the DEFAULT font, chosen by your browser (usually Times New Roman). I can change this with CSS.
If you use an abbreviation or acronym, then the <abbr> element can be used. A title attribute on the opening tag is used to specify the full term. This is a handy way to write UCBA but still include the entire name of the college.
These two elements designate quoted text. BLOCKQUOTE is for long quotations (block-level content) and Q is intended for short quotations (inline content) that don't require paragraph breaks.
If you have a long quotation, testimonial, or a long section of copy you can use the blockquote tag.
The blockquote tag is supposed to contain only other blocklevel elements within it, and not just plain text. To be strict XHTML the text should be in a blocklevel element like the paragraph tag.
This example formats an excerpt from The Two Towers, by J. R. R. Tolkien
Standing there for a moment filled with dread Frodo became aware that a light was shining; he saw it glowing on Sam’s face beside him. Turning towards it, he saw, beyond an arch of boughs, the road to Osgiliath running almost as straight as a stretched ribbon down, down, into the west. There, far away, beyond sad Gondor now overwhelmed in shade, the Sun was sinking, finding at last the hem of the great slow-rolling pall of cloud, and falling in an ominous fire towards the yet unsullied Sea. The brief glow fell upon a huge sitting figure, still and solemn as the great stone kings of Argonath. The years had gnawed it, and violent hands had maimed it. Its head was gone, and in its place was set in mockery a round rough-hewn stone, rudely painted by savage hands in the likeness of a grinning face with one large red eye in the midst of its forhead. Upon its knees and mighty chair, and all about the pedestal, were idle scrawls mixed with the foul symbols that the maggot-folk of Mordor used.
Suddenly, caught by the level beams, Frodo saw the old king’s head: it was lying rolled away by the roadside. ‘Look, Sam!’ he cried, startled into speech. ‘Look! The king has got a crown again!’ The eyes were hollow and the carven beard was broken, but about the high stern forehead there was a coronal of silver and gold. A trailing plant with flowers like small white stars had bound itself across the brows as if in reverence for the fallen king, and in the crevices of his stony hair yellow stonecrop gleam
‘They cannot conquer for ever!’ said Frodo. And then suddenly the brief glimpse was gone. The sun dipped and vanished, and as if the shuttering of a lamp, black night fell.
For shorter quotes I use the q tag, which is an inline element
The following example illustrates nested quotations with the Q element.
John said, I saw Lucy at lunch, she told me
Mary wants you to get some ice cream on your way home.
I think I will get some at Ben and Jerry's, on Gloucester Road.
The <address> element has surprising purpose: to contain contact details for the author of the page. It is not necessarily for a street address and will more likely have a name, e-mail address or phone number.
This page was created by
This paragraph demonstrates the line break,
as used within a block level element.
This is on a new line...
and this is on another new line. The line break should be used within
block level elements. To achieve the same spacing effect outside of such elements,
you should make use of: Cascading Style Sheets.
The pre element is unique because web browsers normally eliminate any whitespace. However, text within a pre element will display the whitespace exactly as it is in the code.
So I can have text like this