123 HTML School: Lesson 3: HTML Head Element

The <head> element is a container for all the head elements. Elements inside <head> can include scripts, instruct the browser where to find style sheets, provide meta information, and more.

The following tags can be added to the head section: <title>, <style>, <meta>, <link>, <script>, <noscript>, and <base>.

HTML Title Element

The <title> tag defines the title of the document.
The <title> element is required in all HTML/XHTML documents.
The <title> element defines a title in the browser toolbar.
The <title> element provides a title for the page when it is added to favorites.
The <title> element displays a title for the page in search-engine results.

Example :-

Open a text editor and type the following lines. <!DOCTYPE html><html> <head><title>Title of the document</title></head> <body><p>The content of the document......</P> </body> </html>
Save file.
Open that file in a web browser.
You get like this out put.

HTML Base Element

The <base> tag specifies a default address or a default target for all links on a page:

Example :-

<!DOCTYPE html><html>   <head><base href="http://www.123schools.blogspot.com/images/"><base target="_blank"><title>Title of the document</title></head>   <body><p>The content of the document......</P>  </body> </html>

HTML Link Element

The <link> tag defines the relationship between a document and an external resource.
The <link> tag is most used to link to style sheets:

Example :-

<!DOCTYPE html><html>   <head><base href="http://www.123schools.blogspot.com/images/"><base target="_blank"><link rel="stylesheet" type="text/css" href="mystyle.css"><title>Title of the document</title></head>   <body><p>The content of the document......</P>  </body> </html>

HTML Style Element

The <style> tag is used to define style information for an HTML document.
Inside the <style> element you specify how HTML elements should render in a browser.

Example :-

<!DOCTYPE html><html>   <head><base href="http://www.123schools.blogspot.com/images/"><base target="_blank"><link rel="stylesheet" type="text/css" href="mystyle.css"><title>Title of the document</title><style type="text/css">body {background-color:yellow}p {color:blue}</style></head>   <body><p>The content of the document......</P>  </body> </html>

HTML Meta Element

Metadata is data (information) about data.The <meta> tag provides metadata about the HTML document. Metadata will not be displayed on the page, but will be machine parsable.Meta elements are typically used to specify page description, keywords, author of the document, last modified, and other metadata.The metadata can be used by browsers (how to display content or reload page), search engines (keywords), or other web services.<meta> tags always goes inside the <head> element.

Meta Tags - Examples of Use:-

Define keywords for search engines:

<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">

Define a description of your web page:

<meta name="description" content="Free Web tutorials on HTML and CSS">

Define the author of a page:

<meta name="author" content="Hege Refsnes">

Refresh document every 30 seconds:

<meta http-equiv="refresh" content="30">

HTML Script Element

The <script> tag is used to define a client-side script, such as a JavaScript.

Example :-

<script type="text/javascript">//<![CDATA[ var i=10; if (i<5)   {   // some code   } //]]></script>

The <script> element will be explained in a later chapter.

Note:- Don't worry if the examples use tags you have not learned. You will learn about them in the next chapters.

123 HTML School

Pages

Thursday, November 1, 2012

Lesson 3: HTML Head Element