Monday 4 November 2024

What is head Tag in HTML?

The <head> tag contains meta-information about the HTML document that isn't directly visible on the webpage but is crucial for browsers and search engines. This meta-information helps define the document’s title, character set, styles, scripts, and more.


Elements Inside the <head> Tag

Here are some common elements you can include in the <head> tag:

 

1. <title>: Sets the title of the webpage, which appears in the browser's title bar or tab.

<title>My Webpage</title>

 

2. <meta>: Provides metadata about the HTML document, such as the character set, author, description, and viewport settings.

<meta charset="UTF-8">

<meta name="description" content="A brief description of the page">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

 

3. <link>: Links to external resources like stylesheets. It’s commonly used to link CSS files.

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

 

4. <style>: Contains internal CSS styles specific to that page. It’s used for styles that are not shared across multiple pages.

 

<style>

  body { font-family: Arial, sans-serif; }

</style>

 

5. <script>: Embeds or links to JavaScript files. You can place JavaScript code directly here or link to an external script.

<script src="script.js"></script>

 

6. <base>: Sets a base URL for all relative URLs in the document.

<base href="https://www.example.com/">

 

7. <noscript>: Provides alternative content for users who have JavaScript disabled.

<noscript>Your browser does not support JavaScript!</noscript>

 

head-element.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="A brief description of the page">
    <title>My Webpage</title>
    <link rel="stylesheet" href="styles.css">
    <style>
        body { font-family: Arial, sans-serif; }
    </style>
    <script>
        alert("Hello World");
    </script>
</head>
<body>
    <h1>Welcome to My Webpage!</h1>
</body>
</html>

  Open above page in browser, you will see an alert box, once you close the alert box, the content of the page are displayed.

 

Previous                                                    Next                                                    Home

No comments:

Post a Comment