From e9bcd5e752e9fdc84f392dd83495028574be3d7c Mon Sep 17 00:00:00 2001 From: Skand Singh Date: Sun, 12 May 2024 23:19:43 +0530 Subject: [PATCH 1/2] Syntax and structure file added --- docs/html/syntax-structure-html.md | 95 ++++++++++++++++++++++++++++++ 1 file changed, 95 insertions(+) create mode 100644 docs/html/syntax-structure-html.md diff --git a/docs/html/syntax-structure-html.md b/docs/html/syntax-structure-html.md new file mode 100644 index 000000000..8099f123c --- /dev/null +++ b/docs/html/syntax-structure-html.md @@ -0,0 +1,95 @@ +--- +id: structure-and-syntax-html +title: Introduction of structure and syntax +sidebar_label: HTML structure and Syntax +tags: [html, structure, syntax, web-development, front-end-development, web-design] +description: In this tutorial, you will learn about HTML Structure and HTML Syntax +--- +HTML (HyperText Markup Language) is the standard markup language for creating web pages. It describes the structure of a web page and consists of a series of elements. HTML elements tell the browser how to display the content. + +## HTML Syntax + +HTML syntax consists of a set of elements, tags, attributes, and their combinations. Here's a breakdown: + +1. **Elements** : HTML documents are built using elements, which are structured by HTML tags. Elements typically consist of an opening tag, content, and a closing tag. + ```html + Content goes here + ``` +2. **Tags**: Tags are keywords enclosed in angle brackets (<>) that define the structure and content of HTML elements. They can be categorized into two types: + + + **Opening Tags** : They denote the beginning of an element and have the tag name wrapped in angle brackets. + ```html + + ``` + + **Closing Tags** : They denote the end of an element and have the tag name wrapped in angle brackets, preceded by a forward slash (/). + + ```html + + ``` + Some tags, like ``, ``, and `
`, are self-closing and do not require a separate closing tag. + +3. **Attributes** : HTML elements can have attributes that provide additional information about them. Attributes are added to the opening tag and are written as name-value pairs. + ```html + + ``` +For example: + ```html + Description + ``` + +## HTML Structure + +HTML documents have a hierarchical structure consisting of various elements. Here's a breakdown of the structure: + + +Here's a basic HTML structure: + +1. `` : Declares the document type and version of HTML. +2. `` : The root element of the HTML document. +3. `` : Contains meta-information about the document, such as character encoding, viewport settings, and title. +4. `` : Specifies the character encoding of the document. +5. `` : Sets the viewport properties for responsive design. +6. `` : Defines the title of the document. +7. `<body>` : Contains the visible content of the HTML document. +8. `<header>`, `<main>`, `<footer>` : Semantic HTML5 elements for structuring the header, main content, and footer sections of the page. +9. `<section>, <article>, <aside>`: Additional semantic HTML5 elements for organizing content within the main section of the page. + + +``` html + <!DOCTYPE html> + <html lang="en"> + <head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <title>Your Page Title + + + + +
+ +
+ +
+ +
+ +
+
+ +
+ +
+ +
+ +
+ + +``` + +### conclusion + +Together, HTML syntax and structure enable developers to craft web pages that are both functional and user-friendly, facilitating seamless navigation and interaction for visitors. Understanding and adhering to these principles is essential for creating well-structured, semantically meaningful, and standards-compliant web content. \ No newline at end of file From 73fe5b6305748237e1f545891579c183df2ef02d Mon Sep 17 00:00:00 2001 From: Skand Singh Date: Sun, 12 May 2024 23:33:58 +0530 Subject: [PATCH 2/2] Updated syntax-structure-html.md --- docs/html/syntax-structure-html.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/html/syntax-structure-html.md b/docs/html/syntax-structure-html.md index 8099f123c..764c2f7df 100644 --- a/docs/html/syntax-structure-html.md +++ b/docs/html/syntax-structure-html.md @@ -15,13 +15,13 @@ HTML syntax consists of a set of elements, tags, attributes, and their combinati ```html Content goes here ``` -2. **Tags**: Tags are keywords enclosed in angle brackets (<>) that define the structure and content of HTML elements. They can be categorized into two types: +2. **Tags**: Tags are keywords enclosed in angle brackets `<>` that define the structure and content of HTML elements. They can be categorized into two types: + **Opening Tags** : They denote the beginning of an element and have the tag name wrapped in angle brackets. ```html ``` - + **Closing Tags** : They denote the end of an element and have the tag name wrapped in angle brackets, preceded by a forward slash (/). + + **Closing Tags** : They denote the end of an element and have the tag name wrapped in angle brackets, preceded by a forward slash `/`. ```html @@ -92,4 +92,4 @@ Here's a basic HTML structure: ### conclusion -Together, HTML syntax and structure enable developers to craft web pages that are both functional and user-friendly, facilitating seamless navigation and interaction for visitors. Understanding and adhering to these principles is essential for creating well-structured, semantically meaningful, and standards-compliant web content. \ No newline at end of file +Together, HTML syntax and structure enable developers to craft web pages that are both functional and user-friendly, facilitating seamless navigation and interaction for visitors. Understanding and adhering to these principles is essential for creating well-structured, semantically meaningful, and standards-compliant web content.