HTML header - HTML Tutorial - Punchitech


This website uploads some web development tutorials, like HTML, CSS, JavaScript, and Bootstrap also PHP and more stuff about web development.

Nov 29, 2019

HTML header - HTML Tutorial

HTML <head>

The HTML header element contains summary information about the document, also known as meta-information.

HTML <head> element

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

HTML header

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

The <head> element describes various attributes and information of a document, including the title of the document, its location on the Web, and its relationship to other documents.

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
  • Title displayed in favorites when webpage is added to favorites
  • Title displayed on search engine results page
A simple HTML document:
<!DOCTYPE html>      
<title>Title of the document</title>        
The content of the document......        

HTML <base> element

The <base> tag describes the basic link address / link destination. This tag serves as the default link for all link tags in HTML documents:
<base href="//" target="_blank">      
Tip: In HTML, the <base> tag has no end tag; in XHTML, the <base> tag must be properly closed.

HTML <link> element

The <link> tag defines the relationship between a document and external resources.
The <link> tag is usually used to link to a style sheet:
<link rel="stylesheet" type="text/css" href="mystyle.css">        

HTML <style> element

The <style> tag defines the style file reference address of the HTML document.
In the <style> element you need to specify a style file to render the HTML document:
<style type="text/css">        
body {background-color:yellow}        
p {color:blue}        

HTML <meta> element

The meta tag describes some basic metadata.

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

The META element is usually used to specify the description, keywords, last modification time of the file, 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 usually placed in the <head> area

<meta> tag-use case

Define keywords for search engines:
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
Define a description for the web page:
<meta name="description" content="Free Web tutorials on HTML and CSS">
Define Web page author:
<meta name="author" content="punchi">
Refresh the current page every 30 seconds:
<meta http-equiv="refresh" content="30">

HTML <script> element

The <script> tag is used to load a script file, such as JavaScript.
The <script> element is described in detail in the following sections.

HTML head element

Tag Description
<head> Information defining the document
<title> Defines the title of the document
<base> Defines the default link address of the page link label
<link> Defines the relationship between a document and external resources
<meta> Defines metadata in HTML documents
<script> Client-side script file defined
<style> Defines style files for HTML documents

HTML Basic Tags
HTML Editors
HTML Introduction
HTML Attributes
HTML Titles
HTML Paragraphs
HTML  Text Formatting