Web Development
📘 Module 1: Introduction to Web Development
What is Web Development?
Frontend vs Backend vs Full Stack
How Websites Work (Client, Server, Browser)
Overview of HTML, CSS, JavaScript
Tools: Code Editor (VS Code), Browser Dev Tools
🟧 HTML5 Syllabus – Module by Module
📗 Module 2: HTML5 Basics
Introduction to HTML
Structure of an HTML document
Basic Tags: <!DOCTYPE>, <html>, <head>, <body>
Headings (<h1> to <h6>)
Paragraphs, Line Breaks, Horizontal Rule
📙 Module 3: HTML Text Formatting and Lists
Bold, Italic, Underline: <b>, <i>, <u>
Superscript, Subscript
Lists:
o Ordered Lists <ol>
o Unordered Lists <ul>
o Description Lists <dl>
📕 Module 4: Links, Images, and Tables
Anchor Tags <a> (internal, external, mailto, target)
Image Tag <img>
HTML Tables:
o <table>, <tr>, <td>, <th>
o Table Borders, Cell Spacing, Merging
📘 Module 5: HTML Forms
Form Tag and Input Fields
TextBox, Radio Button, Checkbox, Dropdown, TextArea
Submit and Reset Buttons
Input types: email, number, date, password
label, fieldset, legend
📗 Module 6: Semantic HTML & HTML5 New Tags
Semantic Tags: <header>, <footer>, <main>, <nav>, <section>, <article>
Media Tags: <audio>, <video>
iframe Embedding
🎨 CSS3 Syllabus – Module by Module
📙 Module 7: CSS Basics
What is CSS?
Inline, Internal, External CSS
CSS Syntax: Selector { property: value; }
Color Names, Hex, RGB, RGBA
📕 Module 8: CSS Selectors and Text Styling
Types of Selectors:
o Element, ID (#), Class (.), Group, Universal (*)
Text Properties:
o font-size, color, text-align, line-height
o font-family, text-decoration
📘 Module 9: Box Model and Spacing
Box Model: content, padding, border, margin
Width, Height
Border styles
Overflow and visibility
📗 Module 10: Backgrounds and Gradients
Background Image, Repeat, Size, Position
Linear and Radial Gradients
📙 Module 11: Positioning and Display
CSS Position: static, relative, absolute, fixed, sticky
Display: block, inline, inline-block, none
Float and Clear
z-index layering
📕 Module 12: CSS Flexbox and Layout
Display: flex
Direction, Wrapping, Alignment (justify-content, align-items)
Flex Properties: flex-grow, flex-shrink, flex-basis
🎀 Bootstrap 5 Syllabus – Module by Module
📘 Module 13: Introduction to Bootstrap
What is Bootstrap?
Setting up Bootstrap using CDN
Bootstrap Grid System (12 columns)
Containers (.container, .container-fluid)
📗 Module 14: Bootstrap Typography & Colors
Bootstrap Text Utilities
Headings, Lead, Text Alignment
Bootstrap Color Classes (.text-danger, .bg-primary)
📙 Module 15: Bootstrap Components
Buttons and Button Groups
Badges, Alerts
Cards, List Groups
Pagination, Breadcrumb
📕 Module 16: Bootstrap Forms
Form Layouts: Inline, Stacked
Form Controls: Inputs, Selects, Checkboxes
Validation Classes
📘 Module 17: Bootstrap Navbar and Navigation
Navigation Bars
Collapsible Nav
Responsive Navbar Toggle
Dropdown Menus
📗 Module 18: Bootstrap Utilities
Margin and Padding Utilities
Border, Shadow, Text, Background Helpers
Display, Flex, Sizing, Float utilities