Site Sponsors

Archive for the ‘HTML’ Category

html tag: head

Friday, January 11th, 2008

The head is where all the information about the document is contained.

Information which is displayed in the header would are; the title of the site (this is compulsory), meta, style, scripts and link.

The opening of the head tag is to start immediately after the html and close directly before the start of the body tag.

Example

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link type=”text/css” rel=”stylesheet” href=”style.css” />
 </head>
     <body>
          <p>Hello World!!</p>
     </body>
</html>

Tags: , , , , , ,
Posted in:HTML, Tags | No Comments »

html tag: body

Wednesday, January 9th, 2008

The body tag is again one of the most important tags when writing a HTML document. The body tag contains the body content of the site. eg text, images, links, tables etc.

The body tag comes immediately after the closing of the head tag (</head>) and closes immediately before the closing of the html tag (</html>).

Example

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link type=”text/css” rel=”stylesheet” href=”style.css” />
 </head>
     <body>
          <p>Hello World!!</p>

     </body>
</html>

Tags: , ,
Posted in:HTML, Tags | No Comments »

html attribute: href

Monday, January 7th, 2008

href is the target URL of the external page or file.

The href is used in the a and link tags.

Example

Linking to a CSS

<link type=”text/css” rel=”stylesheet” href=”style.css” />

Linking an anchor tag to a seperate URL

<a href=”http://www.htmlsource.co.uk”>HTML Source</a>

Tags: , , ,
Posted in:Attributes, HTML | No Comments »

html tag: link

Monday, January 7th, 2008

The link tag helps us reference an external file such as a CSS file.

The link tag must only appear in between the head tags.

Example

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link type=”text/css” rel=”stylesheet” href=”style.css” />
 </head>
     <body>
          <p>Hello World!!</p>

     </body>
</html>

Additional Atributes

(not required)
Most commonly used:

  • href - specifies the link to the external file eg. href=”style.css”
  • type - this specifies the type of file you are linking to eg. type=”text/css”
  • rel - specifies relationship to the linked file eg. rel=”stylesheet”
  • media - specifies media type the linked file is to be used for eg. media=”screen” or media=”print”. You can have multiple media types under one attribute e.g media=”screen, print, projector”

Other

  • charset - specifies the characterset of the externally link file eg. charset =”UTF-8″
  • hreflang - this specifies the language of the external linked page eg. type=”en-us” (English - United States)

Tags: , , , , ,
Posted in:HTML, Tags | No Comments »

html tag: html

Sunday, January 6th, 2008

The html tag is what helps structure the document and define the rest of the content as being html.

The opening tag is the first tag within the file immediatley below the <!DOCTYPE> and the closing tag is the very last tag on the page to close the html document.

Within the html tags you must also have the following tags: head & body

Requirements

xmlns is used to define the XML namespace.

Example

Using our index.html example again (found here), we can add the necessary tags.

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

 </head>
     <body>
          Hello World!!
     </body>
</html>

Tags: , , ,
Posted in:HTML, Tags | No Comments »

html declaration: DOCTYPE

Friday, January 4th, 2008

<!DOCTYPE> declaration is the very first thing in your document, before the <html> tag. This declaration of the <!DOCTYPE> tells the browser which HTML or XHTML specification the document uses.

Everything in this declaration needs to match exactly (both spelling and case). If this is not entered into all your pages your browser will render your page in “Quirks Mode”, your page will not validate correctly with W3C Standards and you will spend more time getting your site to look perfect across all browsers then necessary.

N.B. Doctype is a shorted term for DTD.

Right, on with the different types of <!DOCTYPE> declarations:

HTML

There are 3 different DTD available to use under the HTML deleration: Strict, Transitional, and Frameset. Even though the below declerations are for HTML these are slowly been phased out in preference for the XHTML DTD below.

HTML 4 Strict DTD

Generally used when all formatting & styling are placed into the CSS file.

 < !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

HTML 4 Transitional DTD

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

HTML 4 Frameset DTD

This DTD is used if you are using frames for some reason??

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">

XHTML

Again there are 3 XML document types: Strict, Transitional, and Frameset.

XHTML Strict DTD

Generally used when all formatting & styling are placed into the CSS file.

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

XHTML Transitional DTD

This DTD supports everything found in XHTML 1.0 Strict, but also permits the use of a number of elements and attributes that are judged presentational such elements include <center>, <u>, <b> and <strike>.

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

XHTML Frameset DTD

This DTD is used if you are using frames for some reason??

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

Example:

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
     <body>
          Hello World!!
     </body>
</html>

You will notice that all the tags/elements are all in lower case, this is a must as you will not have a valid webpage otherwise.

Tags: , , , , , ,
Posted in:Declarations, HTML | No Comments »