Class notes CODING

HTML & CSS Notes 1. Introduction to HTML Definition: HTML is the standard markup language for creating web pages. Basic Structure: html Copy code !DOCTYPE html html head titlePage Title/title /head body h1Heading/h1 pThis is a paragraph./p /body /html Common Elements: Headings: h1, h2, h3 (levels 1-6) Paragraphs: p Links: a href="url"Link Text/a Images: img src="" alt="description" Lists: Ordered: olliItem/li/ol Unordered: ulliItem/li/ul Tables: tabletrtdCell/td/tr/table 2. Introduction to CSS Definition: CSS styles the layout and appearance of web pages. Syntax: css Copy code selector { property: value; } Example: css Copy code body { background-color: #f0f0f0; font-family: Arial, sans-serif; } 3. Ways to Apply CSS Inline CSS: Directly within an HTML tag: html Copy code p style="color: blue;"This is a blue paragraph./p Internal CSS: Inside a style tag in the head: html Copy code style h1 { color: red; } /style External CSS: Linked via a .css file: html Copy code link rel="stylesheet" href="" 4. CSS Selectors Basic Selectors: Universal: * Type: h1, p, div Class: .class-name ID: #id-name Combinators: Descendant: div p Child: div p Adjacent Sibling: h1 + p General Sibling: h1 ~ p 5. CSS Box Model Components: Content: The content of the box (text, images). Padding: Space between content and border. Border: Surrounds the padding. Margin: Space between the border and other elements.