HTML

HTML is the standard markup language for creating Web pages.

HTML stands for Hyper Text Markup Language

HTML describes the structure of a Web page

HTML consists of a series of elements

HTML elements tell the browser how to display the content

HTML elements label pieces of content such as "this is a heading", "this is a paragraph", "this is a link", etc.

Element	Description
<html>	Defines the root of an HTML document.
<head>	Contains metadata about the document, including the title and links to CSS stylesheets and JavaScript files.
<title>	Sets the title of the document that appears in the browser's title bar.
<body>	Contains the visible content of the document, including headings, paragraphs, and images.
<h1><h6>	Defines headings of varying sizes.
<p>	Defines a paragraph of text.
<a>	Creates a hyperlink to another webpage or resource.
<img>	Embeds an image into the document.
<ul><li>	Creates an unordered list of items.
<ol><li>	Creates an ordered list of items.
<div>	Defines a container for grouping HTML elements and applying styles.
<span>	Defines a small section of text that can be styled separately from the surrounding text.
<form>	Creates a form for user input, such as text boxes, radio buttons, and checkboxes.
<input>	Defines an input field for user input.
<button>	Creates a clickable button.

CSS

CSS stands for Cascading Style Sheets

CSS describes how HTML elements are to be displayed on screen, paper, or in other media

CSS saves a lot of work. It can control the layout of multiple web pages all at once

External stylesheets are stored in CSS files

Selector	Description	Example
Type Selector	Selects all elements of a specific type	p { color: red; }
ID Selector	Selects an element with a specific ID	#header { background-color: blue; }
Class Selector	Selects elements with a specific class	.button { border: 1px solid black; }
Descendant Selector	Selects an element that is a descendant of another element	nav a { text-decoration: none; }
Child Selector	Selects an element that is a direct child of another element	ul > li { padding: 10px; }
Adjacent Sibling Selector	Selects an element that is immediately preceded by another element	h2 + p { font-weight: bold; }
General Sibling Selector	Selects elements that are siblings of another element	h2 ~ p { color: gray; }