> For the complete documentation index, see [llms.txt](https://eleven-fifty-academy.gitbook.io/dotnet-100-prework-gitbook/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://eleven-fifty-academy.gitbook.io/dotnet-100-prework-gitbook/part-1-html-fundamentals/basic-tags.md).

# Basic Tags

In this module, we'll discuss the following:

1. Basic tags, especially head & body.
2. Create a basic Hello World page

## File Location

You should be located in the following file:

```
 DotNetProjects
        └── HTMLCSSPreWork
            └── 1-HTML-Basics

                01-basic-tags.html <-----You should be here

            └── 2-CSS-Basics
```

## Tags

A tag is used to surround content and apply meaning. The opening tag tells the browser to start *rendering* something. The closing tag tells the browser where the tag ends.

## Starter Code

While inside your `01-basic-tags.html`, add the following code:

```markup
<!DOCTYPE html>
<html>
    <head>

    </head>
    <body>
        <h1>Hello World</h1>
    </body>
</html>
```

Notice that there is a closing tag for each opening one. For instance, `<h1>` is closed by `</h1>`. The `/` indicates closing. So everything within those two tags will be shown in the browser.

Let's break down a few of the tags in the above code:

## DOCTYPE

`DOCTYPE` states the document type. It's a declaration that lets the browser know which flavor of html you are using. For our purposes in this course, we will always use this tag to start our `html` pages.

## `<html>The HTML Tag</html>`

`html` hypertext markup language is language used for describing web documents. All of our HTML code will get nested inside of there.

## `<head>The Head Tag</head>`

The `<head>` element is a container for metadata (data about data) and is placed between the `<html>` tag and the `<body>` tag. Excluding the `<title>` tag, contents inside the head tag are not visible on the page.

## `<title>The Title Tag</title>`

The `<title>` tag is required in all HTML documents, and it defines the title of the document.

1. Defines a title in the browser toolbar
2. Provides a title for the page when it is added to favorites
3. Displays a title for the page in search-engine results

```markup
<!DOCTYPE html>
<html>
    <head>
    <!-- Add title here -->
        <title>Hello World</title>
    </head>
    <body>
        <h1>Hello World</h1>
    </body>
</html>
```

An example: ![title](/files/-LBuvZo8vwp1dXJqWc99)

## `<body>The Body Tag</body>`

The body tag defines a document's body. Items placed inside of the body tag will render to the DOM(the Document Object Model) and be seen in the view.

## Consider This:

Think of the head as doing the invisible thinking and setup; the body manifests or shows the actual content.

## Run the Code

Now that you've added some HTML, let's run the code. 1. Save your file by pressing `ctrl + s` 2. On a Windows machine, click on the `.html` file and press `ctrl + alt + o`. On a Mac `cmd + alt + o`. 3. You should be given a list of browsers. Choose Chrome.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://eleven-fifty-academy.gitbook.io/dotnet-100-prework-gitbook/part-1-html-fundamentals/basic-tags.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
