Scribd
Upload
8 views

10 Days Syllabus for HTML,Css and Js

Uploaded by

Ram udgar Yadav
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
8 views

10 Days Syllabus for HTML,Css and Js

Uploaded by

Ram udgar Yadav
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 3

Day 1 (1.

5 Hours) - Introduction to HTML


1. Introduction to Web Development
 What is HTML?
 Basic Structure of an HTML document
2. Essential HTML Tags
 Headings (<h1> to <h6>), Paragraphs (<p>), and Links (<a>)
 Images (<img>), Lists (<ul>, <ol>, <li>)
3. Attributes in HTML
 src, alt, href, target, etc.
4. Forms in HTML
 Input types, form elements (<input>, <textarea>, <button>, <form>, etc.)
5. Hands-on Practice:
 Create a simple HTML page with headings, images, links, and a form.

Day 2 (1.5 Hours) - Advanced HTML and Introduction to CSS


1. HTML Tables and Multimedia
 Tables (<table>, <tr>, <td>, <th>)
 Embedding multimedia (<audio>, <video>)
2. Introduction to CSS
 What is CSS?
 Inline, Internal, and External CSS
 Basic CSS Syntax and Selectors
3. Hands-on Practice:
 Style the HTML page created on Day 1 with inline and internal CSS.

Day 3 (1.5 Hours) - Basic CSS


1. Selectors, Properties, and Values
 Element, Class, ID selectors
 Colors, Fonts, and Text Styling
 Background and Borders
2. The Box Model
 Margin, Padding, Border, Content
3. Hands-on Practice:
 Style an HTML form using CSS (focus on colors, spacing, and box model).

Day 4 (1.5 Hours) - Layout and Positioning in CSS


1. CSS Layout Techniques
 Display: block, inline, and inline-block
 Positioning (static, relative, absolute, fixed)
 Float and Clear
2. Flexbox (Introduction)
 Basics of Flexbox
 Aligning items, Flexbox properties
3. Hands-on Practice:
 Create a responsive layout using Flexbox.

Day 5 (1.5 Hours) - Introduction to JavaScript


1. What is JavaScript?
 Embedding JS in HTML
 Console and Developer Tools
2. JavaScript Basics
 Variables (var, let, const)
 Data Types, Operators
3. Functions in JavaScript
 Defining and calling functions
 Parameters and return values
4. Hands-on Practice:
 Write basic scripts to manipulate HTML elements.

Day 6 (1.5 Hours) - JavaScript Control Structures


1. Conditionals
 if, else if, else, and switch
2. Loops
 for, while, and do...while
3. Events in JavaScript
 Adding event listeners, Handling button clicks
4. Hands-on Practice:
 Create a simple form validation with JavaScript (using conditionals and loops).

Day 7 (1.5 Hours) - DOM Manipulation with JavaScript


1. Understanding the DOM (Document Object Model)
 Selecting elements with getElementById, querySelector
 Manipulating elements (innerHTML, style changes)
2. Event Handling
 Handling user inputs and changing DOM elements
3. Hands-on Practice:
 Build a simple interactive web page (e.g., a to-do list).

Day 8 (1.5 Hours) - Advanced JavaScript Concepts


1. Arrays and Objects
 Defining and using Arrays and Objects
2. Array Methods
 Common methods (push(), pop(), forEach())
3. Object Methods
 Adding methods to objects
4. Hands-on Practice:
 Manipulate arrays and objects in a web page (e.g., adding tasks to a to-do list).

Day 9 (1.5 Hours) - Final Project


1. Integrating HTML, CSS, and JavaScript
 Plan and structure a simple project
2. Responsive Design
 Use media queries to make the design responsive
3. Hands-on Practice:
 Build a small website with HTML, CSS, and JavaScript (e.g., a portfolio or landing
page).

Day 10 (1.5 Hours) - Final Touches and Deployment


1. Finalizing the Project
 Add finishing touches (styling, functionality)
2. Introduction to Hosting and Deployment
 How to deploy a website using GitHub Pages or any hosting service
3. Hands-on Practice:
 Deploy the final project.

You might also like