HTML Header

View online examples

<title>-defines the title of the HTML document
Use the <title> tag to define the title of the HTML document

<base>-The URL
that defines all links uses <base> to define the default link target address of all links on the page.

<meta>-provides meta tags for HTML documents.
Use <meta> elements to describe the description, keywords, authors, character sets, etc. of HTML documents.

HTML <head> element

The <head> element contains all the head tag elements. In the <head> element you can insert scripts, style files (CSS), and various meta information.

The element tags that can be added to the head area are: <title>, <style>, <meta>, <link>, <script>, <noscript> and <base>.

HTML <title> element

The <title> tag defines the titles of different documents.

<title> is required in HTML/XHTML documents.

<title> element:

  • Defines the title of the browser toolbar
  • When the webpage is added to the favorites, the title displayed in the favorites
  • The title displayed on the search engine results page

A simple HTML document:

Example

<!DOCTYPE html> 
<html> 
  <head> 
    <meta charset = " utf-8 "> 
    <title> Document title </title> 
  </head> 
  <body> 
    Document content......
  </body> 
</html> 

HTML <base> element

The <base> tag describes the basic link address/link target. This tag serves as the default link for all link tags in the HTML document:

<head>
  <base href="http://www.runoob.com/images/" data-et-target-link="_blank">
  <base href = "http://www.runoob.com/images/" target = "_blank" >  
</head>

HTML <link> element

The <link> tag defines the relationship between the document and external resources.

The <link> tag is usually used to link to style sheets:

<head>
  <link rel="stylesheet" type="text/css" href="mystyle.css">
  <link rel = "stylesheet" type = "text/css" href = "mystyle.css" >   
</head>

HTML <style> element

The <style> tag defines the style file reference address of the HTML document.

In the <style> element, you can also directly add styles to render HTML documents:

<head>
  <style type="text/css">
   body {background-color:yellow}
   p {color:blue}
  </style>
</head>

HTML <meta> element

The meta tag describes some basic metadata.

The <meta> tag provides metadata. Metadata is not displayed on the page, but will be parsed by the browser.

The META element is usually used to specify the description of the web page, keywords, the last modification time of the file, the author, and other metadata.

Metadata can be used in browsers (how to display content or reload pages), search engines (keywords), or other web services.

<meta> is generally placed in the <head> area

<meta> tag-use case

Define keywords for search engines:

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

Define description content for web pages:

<meta name="description" content="Free Web & Programming Tutorial">

Define Web page author:

<meta name="author" content="HackerThink">

Refresh the current page every 30 seconds:

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

HTML <script> element

The <script> tag is used to load script files, such as JavaScript.

The <script> element will be described in detail in later chapters.

HTML head element

label description
<head> Defines the information of the document
<title> The title of the document is defined
<base> Defines the default link address of the page link label
<link> Defines the relationship between a document and external resources
<meta> Defines the metadata in the HTML document
<script> Defines the client script file
<style> Defines the style file of the HTML document