Basic HTML Tags by @bhushcodes

CODE ~ X — Thu, 07 Dec 2023 15:42:31 +0000

Basic HTML Tags:

<html></html>:

Defines the root element of an HTML page. It wraps the entire content of the page.

<head></head>:

Contains meta-information about the document, such as the title, links to stylesheets or scripts, meta tags, etc.

<body></body>:

Encloses the visible content of the webpage, including text, images, links, headings, paragraphs, etc.

<title></title>:

Specifies the title of the webpage that appears in the browser's title bar or tab.

<h1></h1> to <h6></h6> (Heading Tags):

<h1> to <h6> are used for headings, where <h1>
represents the highest level of heading and <h6> the lowest level.

<p></p> (Paragraph Tag):

Defines a paragraph. Text enclosed within <p> tags is displayed as a separate paragraph.

<a></a> (Anchor Tag):

Creates hyperlinks to other web pages or resources. The href attribute specifies the destination of the link.

<img> (Image Tag):

Embeds an image into the webpage. It requires the src attribute to specify the image file's URL and may contain an alt attribute for accessibility.

<ul></ul> (Unordered List Tag):

Defines an unordered list, which is a list of items without any particular order. Uses <li> (List Item) tags to define each item.

<ol></ol> (Ordered List Tag):

Defines an ordered list, which is a list of items in a specific order (usually numbered). Also uses <li> tags for list items.

<!--@bhushcodes-->

<!DOCTYPE html>
<html>
<head>
  <title>Basic HTML Tags</title>
</head>
<body>
  <h1>Main Heading</h1>
  <p>This is a paragraph of text.</p>
  <a href="https://www.x.com/bhushcodes">Link to Twitter</a>
  <img src="image.jpg" alt="Description of Image">

  <h2>Subheading</h2>
  <ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
  </ul>

  <h3>Another Subheading</h3>
  <ol>
    <li>First item</li>
    <li>Second item</li>
    <li>Third item</li>
  </ol>
</body>
</html>

This example demonstrates the use of several basic HTML tags to structure content, create headings, paragraphs, links, images, and lists. Understanding and utilizing these tags effectively forms the foundation of creating simple yet structured web pages.

Follow for more 😊 👉🏼 @bhushcodes

Introduction to HTML by @bhushcodes

CODE ~ X — Thu, 07 Dec 2023 15:26:47 +0000

What is HTML?

HTML stands for HyperText Markup Language. It's the standard markup language used to create web pages. HTML describes the structure of a web page and its content, using a markup, or tag-based, system to define various elements and their relationships on a webpage.

Role of HTML in Web Development:

HTML is the backbone of web development. It provides the basic structure for content on a web page. It defines elements such as headings, paragraphs, links, images, lists, and more. When a web browser loads a webpage, it reads the HTML to render and display the content correctly.

Structure of HTML Documents:

HTML documents have a specific structure:

Document Type Declaration (<!DOCTYPE>): It specifies the HTML version being used. For HTML5, the declaration is <!DOCTYPE html>.

HTML Element (<html></html>): The root element that wraps the entire content on a web page.

Head Section (<head></head>): This section contains meta-information about the document, including the title, character set, linking to CSS or JavaScript files, etc.

Body Section (<body></body>): This section contains the visible content of the webpage, such as text, images, links, and other elements.

Elements and Tags:

Elements: In HTML, elements are building blocks that define the structure of a webpage. Each element is enclosed within an opening tag (<tag>) and a closing tag (</tag>). Elements can contain other elements, forming a hierarchical structure.

Tags: Tags are used to mark the beginning and end of HTML elements. They are made up of angle brackets, with the opening tag containing the element name and the closing tag preceded by a forward slash.

Example of a simple HTML document structure:

<!--@bhushcodes-->
<!DOCTYPE html>
<html>
<head>
  <title>My First Web Page</title>
</head>
<body>
  <h1>Welcome to My Page</h1>
  <p>This is a paragraph of text.</p>
  <img src="image.jpg" alt="Description of Image">
  <a href="https://www.x.com/bhushcodes/">Link to Twitter</a>
</body>
</html>

In this example:

<!DOCTYPE html> declares the HTML5 document type.
<html> wraps the entire content.
<head> contains the title of the page.
<body>contains the visible content like heading (<h1>), paragraph (<p>), image (<img>), and link (<a>).

Understanding these basic concepts of HTML is crucial for building web pages. It's the foundation upon which more advanced web development techniques are built.