Home
📄 Exercise 1 — HTML Basics
- Basic HTML page structure:
<html>, <head>,
<body>
- Headings
<h1> to <h6>, Paragraphs <p>
- Lists:
<ul>, <ol>, <li>
- Links:
<a href=""> and Images: <img src="" alt="">
📄 Exercise 2 — HTML Forms & Tables
- Tables:
<table>, <tr>, <th>,
<td>, colspan, rowspan
- Forms:
<form action="" method="">
- Input types: text, password, radio, checkbox, submit, email
<textarea>, <select>, <option>
📄 Exercise 3 — CSS Styling
- Inline, Internal (
<style>), External (<link>) CSS
- Selectors: element, class (
.class), ID (#id), descendant
- Colors: name, hex (
#fff), rgb(), background-color
- Font: font-family, font-size, font-weight, text-align, text-decoration
- Box Model: margin, padding, border, width, height
📄 Exercise 4 — CSS Layouts
- Display: block, inline, inline-block, none
- Position: static, relative, absolute, fixed, sticky
- Float & Clear
- Flexbox:
display:flex; justify-content; align-items; flex-direction
- Responsive:
@media queries for different screen sizes
📄 Exercise 5 — JavaScript Basics
- Variables:
var, let, const
- Data types: number, string, boolean, undefined, null
- Operators: arithmetic (+, -, *, /), comparison (==, ===, !=), logical (&&, ||, !)
- Conditionals:
if/else, switch/case
- Loops:
for, while, do...while
- Output:
console.log(), alert(), document.write()
📄 Exercise 6 — JavaScript Functions
- Function declaration:
function name(params) { }
- Arrow functions:
const fn = (a, b) => a + b;
- Return values, default parameters
- Arrays: push, pop, shift, unshift, splice, slice, map, filter, forEach
- Objects: key-value pairs, dot notation, bracket notation
📄 Exercise 7 — DOM Manipulation
document.getElementById(), querySelector(),
querySelectorAll()- Modify content:
.innerHTML, .textContent, .value
- Modify style:
.style.property, .classList.add/remove/toggle
- Create elements:
createElement(), appendChild(),
removeChild()
📄 Exercise 8 — Events & Validation
- Events: click, submit, keydown, keyup, change, mouseover, load
addEventListener('event', handler)- Event object:
e.target, e.preventDefault()
- Form validation: check empty fields, email format, password length
- Regular expressions for input validation:
/pattern/.test(str)