HTML <head> Tag

The container for all the head elements is the <head> element. Elements which are inside <head> may include scripts and instruct the browser where to find style sheets, provide meta information, and so on.

The following tags can be added to the head section:

The <title> tag defines the title of the document in the browser toolbar.

The <style> tag is used to define style information for an HTML document. Inside this tag we write elements on browers.

Let's see the example where we use these 2 tags.

<!DOCTYPE html>
<html>
   <head>
      <title>Title of the document</title>
      <style type="text/css">
         body {background-color:orange;}
         p {color:blue;}
         a{color:pink}
      </style>
   </head>
   <body>
      <p>Some paragraph</p>
      <a>Some link</a>
   </body>
</html>

As you see we use <title> and <style> tags.

You will see in browser toolbar the text which we write inside <title> tag.

You see that inside <style> tag we wrote some styles; that means that our body background-color will be orange, our paragraph will be blue, and our link will be pink.

The <link> tags are used to link the page to other files, for example stylesheets - (CSS styles of the elements in the page).

<!DOCTYPE html>
<html>
   <head>
      <link rel="stylesheet" type="text/css" href="css/style.css">
   </head>
   <body>
      Content of page
   </body>
</html>

What means our link?

It means that our style.css is in our css folder, which we created before. In style.css we write styles of all elements.

The <meta> tags are typically used to specify page description, keywords, author of the document, last modified,other metadata and always go inside the <head> element.

Let's see the examples.

<!DOCTYPE html>
<html>
   <head>
      <meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
      <meta name="description" content="Free Web tutorials on HTML and CSS">
      <meta name="author" content="Hege Refsnes">
      <meta http-equiv="refresh" content="30">
   </head>
   <body>
      Content of page
   </body>
</html>

Script tags are used to link the page to JavaScript files (although this does not necessarily have to be in the head section).

These tags can also contain the JavaScript code instead of an external file.

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