HTML Head Tag

HTML head tag contain other tag that contain metadata. Metadata provides information about the document such as title, description, keywords etc.
The <head> tag is written as <head>.../<head> with the metadata content enclosed between the start and end tags. The <head> tag is placed between the opening and closing <html> tags.
The <head> tag contains following elements:

  1. <title>
  2. <style>
  3. <meta>
  4. <link>
  5. <script>

The <title> Element

The <title> element is used to write the title of a HTML document.

HTML Example:

<!DOCTYPE html>
<html>
<head>
<title> Page Title </title>
</head>
<body>
Body content goes here...
</body>
</html>

Run Example

The <style> Element

The <style> element is used to style a single HTML document.

HTML Example:

<!DOCTYPE html> Page Title
<style>
body { background-color: lightblue; }
h1 { color: red; }
p { color: blue; }
</style>
</html>

Run Example

The <link> Element

The <link> element is used to link external css files.

HTML Example:

<link href="style.css" rel="stylesheet">

Run Example

The <meta> Element

The <meta> element is used to define character set, page description, keywords, author, and other metadata. You will not see any effect of the meta tag in the website. All the meta information goes before the body.

Here is an example of defining the character set:

HTML Example:

<meta charset="UTF-8">


Here is an example of defining a description:

HTML Example:

<meta name="description" content="Online learning website.">


Here is an example of defining keywords for search engines:

HTML Example:

<meta name="keywords" content="learning, html, css, javascript">


Here is an example of defining an author of a page:

HTML Example:

<meta name="author" content="Jason Mike">


The <script> Element

The <script> element is used to connect the JavaScript code with the HTML document.

Example:

<script type="text/javascript">
function jsexample() {
var num2 = 10;
document.write(num2);
}
jsexample();
</script>

Run Example