HTML Syllabus
Module 1: Introduction to HTML
What is HTML and its role in web development
Structure of an HTML document (<!DOCTYPE html>, <html>, <head>, <body>)
Basic tags: headings, paragraphs, line breaks
Comments in HTML
Module 2: Text Formatting & Lists
Bold, italic, underline, superscript, subscript
Ordered lists , unordered lists, description lists
Semantic importance of headings
Module 3: Links & Navigation
Anchor tags and attribute
Internal vs external links
Module 4: Images & Multimedia
Inserting images and attributes
Module 5: Tables
Creating tables
Table attributes
Styling tables with basic attributes
Module 6: Forms & User Input
Form structure
Input types: text, password, email, number, radio, checkbox, file upload
Labels, placeholders, and required fields
Buttons
Module 7: Semantic HTML
Importance of semantic tags for accessibility and SEO
Tags: <header>, <footer>, <article>, <section>, <nav>, <aside>
Difference between <div> and semantic containers
Module 8: HTML5 Features
New input types
Embedding audio and video
Introduction to <iframe>
Module 9: Frames & Frameset (Legacy HTML)
· Difference between <iframe> and <frameset>
· <frameset> structure and attributes (rows, cols)
· <frame> tag and attributes (src, name, scrolling, noresize)
· Nested framesets
CSS3 Syllabus
Module 1: Introduction to CSS
· What is CSS and its role in web design
· CSS syntax: selectors, properties, values
· Inline, internal, and external CSS
· Understanding the cascade and specificity
Module 2: Selectors & Combinators
· Basic selectors: element, class, ID
· Grouping and universal selectors
· Attribute selectors
· Combinators: descendant, child, adjacent sibling, general sibling
· Pseudo-classes
· Pseudo-elements
Module 3: Colors, Backgrounds & Borders
· Color formats: HEX, RGB, RGBA, HSL
· Background properties: image, repeat, position, size, gradients
· Border styles, rounded corners
· Box shadows and text shadows
Module 4: Text & Fonts
· Font properties: family, size, weight, style
· Text alignment, spacing, decoration, transform
Module 5: Box Model & Layout Basics
· Content, padding, border, margin
· Display property
· Visibility vs display
· Overflow handling
Module 6: Positioning & Floating
· Static, relative, absolute, fixed, sticky positioning
· Float and clear properties
· Z-index and stacking context
Module 7: Flexbox
· Introduction to Flexbox
· Main axis vs cross axis
· Properties:
· Flex-grow, flex-shrink, flex-basis
· Building responsive layouts with Flexbox
Module 8: CSS Grid
· Grid container and grid items
· Defining rows and columns
· Grid areas and item placement
· Gap property
· Responsive design with Grid
Module 9: Transitions & Animations
· CSS transitions
· Keyframe animations
· Animation properties:
· Combining transitions and animations
Module 10: Responsive Design
· Media queries (@media)
· Relative units: %, em, rem, vh, vw
· Mobile-first design approach
· Responsive images and typography
JavaScript Syllabus
Module 1: Introduction to JavaScript
· What is JavaScript and its role in web development
· Embedding JavaScript in HTML (<script> tag, external files)
· Display Output on Webpage
· Understanding variables and constants
Module 2: Data Types & Operators
· Primitive types: string, number, boolean, null, undefined, symbol
· Objects and arrays
· Arithmetic, comparison, logical, and assignment operators
· Type conversion and coercion
Module 3: Control Structures
· Conditional statements
· Loops
· Iteration with for...in and for...of
Module 4: Functions
· Function declaration vs function expression
· Parameters, arguments, default values
· Return values
· Scope (local, global, block)
Module 5: Objects & Arrays
· Object creation and manipulation
· Array methods
· Spread and rest operators
Module 6: DOM Manipulation
· Document Object Model (DOM) basics
· Selecting elements
· Changing content and styles
· Event handling (onclick, addEventListener)
· Creating and removing elements dynamically