From e949e425bae8049369a873d60f258e08ff16f64e Mon Sep 17 00:00:00 2001 From: Ajay Dhangar Date: Thu, 20 Nov 2025 20:33:57 +0530 Subject: [PATCH] added tags in css docs --- docs/css/basics/cascading-order.mdx | 1 + docs/css/basics/external.mdx | 1 + docs/css/basics/inline.mdx | 1 + docs/css/basics/internal.mdx | 1 + docs/css/introduction.mdx | 1 + docs/css/selectors/attribute-selectors.mdx | 1 + docs/css/selectors/combinators/adjacent-sibling.mdx | 1 + docs/css/selectors/combinators/child.mdx | 1 + docs/css/selectors/combinators/descendant.mdx | 1 + docs/css/selectors/combinators/general-sibling.mdx | 1 + docs/css/selectors/pseudo-classes.mdx | 1 + docs/css/selectors/pseudo-elements.mdx | 1 + docs/css/selectors/simple/class.mdx | 1 + docs/css/selectors/simple/element.mdx | 1 + docs/css/selectors/simple/grouping.mdx | 1 + docs/css/selectors/simple/id.mdx | 1 + docs/css/selectors/simple/universal.mdx | 1 + docs/css/syntax-basics/comments.mdx | 1 + docs/css/syntax-basics/rules/declaration.mdx | 1 + docs/css/syntax-basics/rules/properties-and-values.mdx | 1 + docs/css/syntax-basics/rules/selector.mdx | 1 + 21 files changed, 21 insertions(+) diff --git a/docs/css/basics/cascading-order.mdx b/docs/css/basics/cascading-order.mdx index eb0706a..e5078e1 100644 --- a/docs/css/basics/cascading-order.mdx +++ b/docs/css/basics/cascading-order.mdx @@ -3,6 +3,7 @@ title: "The Cascade, Specificity, and Inheritance" sidebar_label: "Cascade Order" description: "Understand the three core principles (C-S-I) that determine which CSS rule wins when conflicts occur, making it the most fundamental concept in CSS." keywords: [CSS Cascade, CSS Specificity, CSS Inheritance, Rule Conflict, Important rule, important, CodeHarborHub CSS] +tags: [CSS Cascade, CSS Specificity, CSS Inheritance, Rule Conflict, Important rule, important] --- You now know there are three ways to write CSS: Inline, Internal, and External. But what happens when you accidentally apply **two different styles** to the same element? diff --git a/docs/css/basics/external.mdx b/docs/css/basics/external.mdx index d7ea382..f41c783 100644 --- a/docs/css/basics/external.mdx +++ b/docs/css/basics/external.mdx @@ -2,6 +2,7 @@ title: External Stylesheets description: "Learn the industry-standard method of linking CSS using the link tag. Understand the crucial benefits of separation of concerns, caching, and scalability." keywords: [CSS External Style, External CSS, link tag, best practice CSS, Frontend Development Scalability, CodeHarborHub CSS] +tags: [CSS External Style, External CSS, link tag, best practice CSS, Frontend Development Scalability] sidebar_label: External Styles --- diff --git a/docs/css/basics/inline.mdx b/docs/css/basics/inline.mdx index acab762..2d9afe5 100644 --- a/docs/css/basics/inline.mdx +++ b/docs/css/basics/inline.mdx @@ -2,6 +2,7 @@ title: Inline Styles description: "Learn how to apply CSS directly to HTML elements using the style attribute. Understand the advantages, disadvantages, and when to use inline styles." keyword: [CSS Inline Style, HTML style attribute, CSS basics, Frontend Styling, Inline vs External CSS] +tags: [CSS Inline Style, HTML style attribute, CSS basics, Frontend Styling, Inline vs External CSS] sidebar_label: Inline Styles --- diff --git a/docs/css/basics/internal.mdx b/docs/css/basics/internal.mdx index 5cb4de1..da96f9a 100644 --- a/docs/css/basics/internal.mdx +++ b/docs/css/basics/internal.mdx @@ -2,6 +2,7 @@ title: Internal Stylesheets description: "Learn how to use Internal Stylesheets with the style tag in the HTML head. Understand when to use this method and its role in the Cascade." keyword: [CSS Internal Style, Embedded CSS, style tag, CSS basics, HTML head, CodeHarborHub CSS] +tags: [CSS Internal Style, Embedded CSS, style tag, CSS basics, HTML head] sidebar_label: Internal Styles --- diff --git a/docs/css/introduction.mdx b/docs/css/introduction.mdx index 5dd0ffa..b52090e 100644 --- a/docs/css/introduction.mdx +++ b/docs/css/introduction.mdx @@ -2,6 +2,7 @@ title: Introduction to CSS description: "Learn the fundamentals of CSS (Cascading Style Sheets), what it is, why it’s essential for web design, and how it works alongside HTML and JavaScript." keywords: [CSS, Cascading Style Sheets, Web Design, Frontend Development, HTML, JavaScript, Styling] +tags: [CSS, Cascading Style Sheets, Web Design, Frontend Development, HTML, JavaScript, Styling] sidebar_label: Introduction image: /tutorial/img/tutorials/css/frontend-trinity-analogy.png --- diff --git a/docs/css/selectors/attribute-selectors.mdx b/docs/css/selectors/attribute-selectors.mdx index d4fffd3..dd7490a 100644 --- a/docs/css/selectors/attribute-selectors.mdx +++ b/docs/css/selectors/attribute-selectors.mdx @@ -2,6 +2,7 @@ title: Attribute Selectors description: "Learn how to use Attribute Selectors to target elements based on the presence, exact value, or partial match of their HTML attributes, such as type, href, or target." keywords: [CSS Attribute Selectors, Attribute presence, Attribute value, Substring matching, CSS Selectors, CodeHarborHub] +tags: [CSS Attribute Selectors, Attribute presence, Attribute value, Substring matching, CSS Selectors] sidebar_label: Attribute Selectors --- diff --git a/docs/css/selectors/combinators/adjacent-sibling.mdx b/docs/css/selectors/combinators/adjacent-sibling.mdx index 27849e4..ca8c0b6 100644 --- a/docs/css/selectors/combinators/adjacent-sibling.mdx +++ b/docs/css/selectors/combinators/adjacent-sibling.mdx @@ -2,6 +2,7 @@ title: The Adjacent Sibling Combinator description: "Learn how to use the Adjacent Sibling Combinator (+) to select an element that immediately follows another element at the same level in the HTML structure." keywords: [CSS Adjacent Sibling Combinator, Plus Selector, Immediate Follow, Sequential Styling, CSS Combinators, CodeHarborHub] +tags: [CSS Adjacent Sibling Combinator, Plus Selector, Immediate Follow, Sequential Styling, CSS Combinators] sidebar_label: Adjacent Sibling Combinator --- diff --git a/docs/css/selectors/combinators/child.mdx b/docs/css/selectors/combinators/child.mdx index 065cab7..a84e76f 100644 --- a/docs/css/selectors/combinators/child.mdx +++ b/docs/css/selectors/combinators/child.mdx @@ -2,6 +2,7 @@ title: The Child Combinator description: "Learn how to use the Child Combinator (>) to target elements that are only one level deep inside a parent, ensuring highly precise and immediate contextual styling." keywords: [CSS Child Combinator, Greater Than Selector, Direct Child, Immediate Nesting, CSS Combinators, CodeHarborHub] +tags: [CSS Child Combinator, Greater Than Selector, Direct Child, Immediate Nesting, CSS Combinators] sidebar_label: Child Combinator --- diff --git a/docs/css/selectors/combinators/descendant.mdx b/docs/css/selectors/combinators/descendant.mdx index 9e7e308..edd9d9a 100644 --- a/docs/css/selectors/combinators/descendant.mdx +++ b/docs/css/selectors/combinators/descendant.mdx @@ -2,6 +2,7 @@ title: The Descendant Combinator description: "Learn how to use the Descendant Combinator (space) to target an element that is nested anywhere inside another specific element." keywords: [CSS Descendant Combinator, Space Selector, Nested Elements, Contextual Styling, CSS Combinators, CodeHarborHub] +tags: [CSS Descendant Combinator, Space Selector, Nested Elements, Contextual Styling, CSS Combinators] sidebar_label: Descendant Combinator --- diff --git a/docs/css/selectors/combinators/general-sibling.mdx b/docs/css/selectors/combinators/general-sibling.mdx index 65371d6..0f78903 100644 --- a/docs/css/selectors/combinators/general-sibling.mdx +++ b/docs/css/selectors/combinators/general-sibling.mdx @@ -2,6 +2,7 @@ title: The General Sibling Combinator description: "Learn how to use the General Sibling Combinator (~) to select all elements that follow a specific preceding element, as long as they share the same parent." keywords: [CSS General Sibling Combinator, Tilde Selector, All Following Siblings, Sequential Styling, CSS Combinators, CodeHarborHub] +tags: [CSS General Sibling Combinator, Tilde Selector, All Following Siblings, Sequential Styling, CSS Combinators] sidebar_label: General Sibling Combinator --- diff --git a/docs/css/selectors/pseudo-classes.mdx b/docs/css/selectors/pseudo-classes.mdx index f6bb8f5..e27bf41 100644 --- a/docs/css/selectors/pseudo-classes.mdx +++ b/docs/css/selectors/pseudo-classes.mdx @@ -2,6 +2,7 @@ title: Pseudo Classes description: "Learn how to use Pseudo-Classes (:) to style elements based on their state (e.g., hover, active, checked) or their position within the HTML structure (e.g., first-child, nth-child)." keywords: [CSS Pseudo-Classes, colon selector, element state, structural pseudo-classes, user interaction, CSS Selectors, CodeHarborHub] +tags: [CSS Pseudo-Classes, colon selector, element state, structural pseudo-classes, user interaction, CSS Selectors] sidebar_label: Pseudo-Classes --- diff --git a/docs/css/selectors/pseudo-elements.mdx b/docs/css/selectors/pseudo-elements.mdx index 402b6de..5823f1c 100644 --- a/docs/css/selectors/pseudo-elements.mdx +++ b/docs/css/selectors/pseudo-elements.mdx @@ -2,6 +2,7 @@ title: Pseudo Elements description: "Learn how to use Pseudo-Elements (::) to style specific parts of an element, or insert decorative content before or after an element's main content." keywords: [CSS Pseudo-Elements, ::before, ::after, ::first-line, ::first-letter, Content Generation, CSS Selectors, CodeHarborHub] +tags: [CSS Pseudo-Elements, ::before, ::after, ::first-line, ::first-letter, Content Generation, CSS Selectors] sidebar_label: Pseudo-Elements --- diff --git a/docs/css/selectors/simple/class.mdx b/docs/css/selectors/simple/class.mdx index 24d82a7..2756caa 100644 --- a/docs/css/selectors/simple/class.mdx +++ b/docs/css/selectors/simple/class.mdx @@ -2,6 +2,7 @@ title: The Class Selector description: "Master the Class Selector (.), the most common and versatile way to target multiple specific HTML elements for styling, offering a great balance of specificity and reusability." keywords: [CSS Class Selector, Dot Selector, Reusable Styles, Medium Specificity, CSS Simple Selectors, CodeHarborHub] +tags: [CSS Class Selector, Dot Selector, Reusable Styles, Medium Specificity, CSS Simple Selectors] sidebar_label: Class Selector --- diff --git a/docs/css/selectors/simple/element.mdx b/docs/css/selectors/simple/element.mdx index af0c02e..6d42369 100644 --- a/docs/css/selectors/simple/element.mdx +++ b/docs/css/selectors/simple/element.mdx @@ -2,6 +2,7 @@ title: The Element Selector description: "Learn how to use the Element Selector (Type Selector) to target all instances of a specific HTML tag, forming the basis of CSS styling." keywords: [CSS Element Selector, Type Selector, HTML Tag Selector, Low Specificity, CSS Simple Selectors, CodeHarborHub] +tags: [CSS Element Selector, Type Selector, HTML Tag Selector, Low Specificity, CSS Simple Selectors] sidebar_label: Element Selector --- diff --git a/docs/css/selectors/simple/grouping.mdx b/docs/css/selectors/simple/grouping.mdx index 61fc1ec..04cb8a7 100644 --- a/docs/css/selectors/simple/grouping.mdx +++ b/docs/css/selectors/simple/grouping.mdx @@ -2,6 +2,7 @@ title: The Grouping Selector description: "Learn how to use the Grouping Selector (comma-separated list) to apply the exact same styles to multiple, different selectors in a single, efficient CSS ruleset." keywords: [CSS Grouping Selector, Comma Selector, CSS Efficiency, Code Duplication, Simple Selectors, CodeHarborHub] +tags: [CSS Grouping Selector, Comma Selector, CSS Efficiency, Code Duplication, Simple Selectors] sidebar_label: Grouping Selector --- diff --git a/docs/css/selectors/simple/id.mdx b/docs/css/selectors/simple/id.mdx index 0ce3473..f43ec34 100644 --- a/docs/css/selectors/simple/id.mdx +++ b/docs/css/selectors/simple/id.mdx @@ -2,6 +2,7 @@ title: The ID Selector description: "Understand the ID Selector (#), its unique nature, and its extremely high specificity. Learn why it is generally reserved for JavaScript and structural targeting, not widespread styling." keywords: [CSS ID Selector, Hash Selector, Unique Element, High Specificity, CSS Simple Selectors, CodeHarborHub] +tags: [CSS ID Selector, Hash Selector, Unique Element, High Specificity, CSS Simple Selectors] sidebar_label: ID Selector --- diff --git a/docs/css/selectors/simple/universal.mdx b/docs/css/selectors/simple/universal.mdx index fe59233..c9d8835 100644 --- a/docs/css/selectors/simple/universal.mdx +++ b/docs/css/selectors/simple/universal.mdx @@ -2,6 +2,7 @@ title: The Universal Selector description: "Learn how to use the Universal Selector (*) to target every single element on a web page, and why it is primarily used for global CSS resets." keywords: [CSS Universal Selector, Asterisk Selector, Global Targeting, CSS Reset, Low Specificity, CSS Simple Selectors, CodeHarborHub] +tags: [CSS Universal Selector, Asterisk Selector, Global Targeting, CSS Reset, Low Specificity, CSS Simple Selectors] sidebar_label: Universal Selector --- diff --git a/docs/css/syntax-basics/comments.mdx b/docs/css/syntax-basics/comments.mdx index bbf3bbe..be98986 100644 --- a/docs/css/syntax-basics/comments.mdx +++ b/docs/css/syntax-basics/comments.mdx @@ -2,6 +2,7 @@ title: Comments in CSS description: "Learn how to use single-line and multi-line comments in CSS to annotate your code, improve readability, and temporarily disable styles." keywords: [CSS Comments, CSS Syntax, Code Annotation, CSS Best Practices, CodeHarborHub] +tags: [CSS Comments, CSS Syntax, Code Annotation, CSS Best Practices] sidebar_label: Comments --- diff --git a/docs/css/syntax-basics/rules/declaration.mdx b/docs/css/syntax-basics/rules/declaration.mdx index 0ccdc07..e56d440 100644 --- a/docs/css/syntax-basics/rules/declaration.mdx +++ b/docs/css/syntax-basics/rules/declaration.mdx @@ -2,6 +2,7 @@ title: The CSS Declaration description: "Learn how the CSS Declaration is formed by combining a property and a value, and how semicolons are used to separate multiple declarations within a ruleset." keywords: [CSS Declaration, Ruleset Structure, CSS Syntax, Semicolon in CSS, CodeHarborHub] +tags: [CSS Declaration, Ruleset Structure, CSS Syntax, Semicolon in CSS] sidebar_label: Declaration --- diff --git a/docs/css/syntax-basics/rules/properties-and-values.mdx b/docs/css/syntax-basics/rules/properties-and-values.mdx index 4dd4680..14153c3 100644 --- a/docs/css/syntax-basics/rules/properties-and-values.mdx +++ b/docs/css/syntax-basics/rules/properties-and-values.mdx @@ -2,6 +2,7 @@ title: CSS Properties and Values description: "Learn the relationship between CSS properties and their assigned values, forming the style declarations within a ruleset." keywords: [CSS Property, CSS Value, Style Declaration, CSS Syntax, CodeHarborHub] +tags: [CSS Property, CSS Value, Style Declaration, CSS Syntax] sidebar_label: Properties and Values --- diff --git a/docs/css/syntax-basics/rules/selector.mdx b/docs/css/syntax-basics/rules/selector.mdx index ada5840..294415b 100644 --- a/docs/css/syntax-basics/rules/selector.mdx +++ b/docs/css/syntax-basics/rules/selector.mdx @@ -2,6 +2,7 @@ title: The CSS Selector description: "Understand the fundamental role of the Selector in a CSS Ruleset—how it targets specific HTML elements to apply styles." keywords: [CSS Selector, Ruleset Structure, CSS Syntax, Targeting HTML, CodeHarborHub] +tags: [CSS Selector, Ruleset Structure, CSS Syntax, Targeting HTML] sidebar_label: Selector ---