4/12/26, 10:58 PM
co urs html
Written by -
Viewden Michel
Based o n, if any
Address -
Pho ne Number -
Email -
Membership Number -
1 / 12
4/12/26, 10:58 PM
# 1️⃣ KISA HTML5 YE?
HTML no u itilize jo di a se vèsyo n 5.
👉 HTML5
HTML5 po te:
* No uvo baliz (semantic)
* Audio & Video
* Fò m pi avanse
* Amelyo rasyo n SEO
---
# 2️⃣ SEMANTIC HTML (TRÈ ENPÒTAN)
Anvan HTML5 mo un te itilize anpil `<div>`.
Ko unye a no u gen baliz ki gen sans.
## 🔹 `<header>`
Pati anlè sit la.
Egzanp:
* Lo go
* Tit sit la
* Menu
---
## 🔹 `<nav>`
2 / 12
4/12/26, 10:58 PM
Zò n navigasyo n.
Egzanp:
* Ho me
* Abo ut
* Co ntact
---
## 🔹 `<sectio n>`
Yo n seksyo n nan paj la.
---
## 🔹 `<article>`
Yo n atik endepandan.
Egzanp:
* Yo n pò s blo g
---
## 🔹 `<fo o ter>`
Pati anba sit la.
Egzanp:
* Co pyright
* Enfò masyo n ko ntak
---
3 / 12
4/12/26, 10:58 PM
⚠️Po ukisa semantic enpò tan?
* Pi bo n SEO
* Pi fasil po u mo tè rechèch ko nprann
* Pi pwo fesyo nèl
---
# 3️⃣ TABLE (TABLO)
Baliz prensipal:
```html
<table>
```
## Eleman yo :
* `<tr>` = table ro w (liy)
* `<th>` = table header
* `<td>` = table data
Egzanp ko nplè:
```html
<table bo rder="1">
<tr>
<th>No n</th>
<th>Laj</th>
</tr>
<tr>
<td>Jean</td>
<td>20</td>
</tr>
4 / 12
4/12/26, 10:58 PM
</table>
```
Eksplikasyo n:
* `<table>` kò manse tablo
* `<tr>` kreye liy
* `<th>` tèt ko lò n
* `<td>` do ne
---
# 📘 KOU 3 – FORM (TRÈ ENPÒTAN)
Fo rm sèvi po u:
* Lo gin
* Enskripsyo n
* Vo ye mesaj
* Ko lekte do ne
Baliz prensipal:
```html
<fo rm>
```
---
# 1️⃣ INPUT
Baliz:
```html
<input>
```
5 / 12
4/12/26, 10:58 PM
Li gen anpil type.
---
## 🔹 Text
```html
<input type="text">
```
Po u no n, mesaj ko ut, elatriye.
---
## 🔹 Passwo rd
```html
<input type="passwo rd">
```
Kache tèks la.
---
## 🔹 Email
```html
<input type="email">
```
Verifye fò ma email.
---
## 🔹 Number
6 / 12
4/12/26, 10:58 PM
```html
<input type="number">
```
Po u chif sèlman.
---
## 🔹 Radio
```html
<input type="radio">
```
Chwazi yo n sèl o psyo n.
---
## 🔹 Checkbo x
```html
<input type="checkbo x">
```
Chwazi plizyè o psyo n.
---
## 🔹 Submit
```html
<input type="submit">
```
Vo ye fò m nan.
7 / 12
4/12/26, 10:58 PM
---
# 2️⃣ LABEL
```html
<label>No n:</label>
```
Li dekri input la.
Li enpò tan po u:
* Aksè
* Pwo fesyo nalis
---
# 3️⃣ TEXTAREA
Po u gwo mesaj.
```html
<textarea></textarea>
```
---
# 4️⃣ SELECT
Lis chwa.
```html
<select>
<o ptio n>Ayiti</o ptio n>
<o ptio n>USA</o ptio n>
8 / 12
4/12/26, 10:58 PM
</select>
```
---
# 📌 ATRIBUT ENPÒTAN NAN FORM
## name
Idantifye do ne a.
## required
Obligatwa.
## placeho lder
Tèks ki parèt anndan input la.
Egzanp ko nplè:
```html
<fo rm>
<label>No n</label>
<input type="text" name="no n" required placeho lder="Antre no n o u">
<br><br>
<label>Email</label>
<input type="email" name="email" required>
<br><br>
<input type="submit" value="Vo ye">
</fo rm>
```
9 / 12
4/12/26, 10:58 PM
---
# 📘 INTRODUCTION A CSS
CSS vle di:
👉 CSS
CSS sèvi po u:
* Mete ko ulè
* Mete gwo sè
* Mete layo ut
* Fè sit la bèl
---
# 1️⃣ Kijan po u mete CSS?
## Inline
```html
<p style="co lo r:red;">Bo njo u</p>
```
---
## Internal
Nan `<head>`:
```html
<style>
p{
co lo r: blue;
10 / 12
4/12/26, 10:58 PM
}
</style>
```
---
## External (pi pwo fesyo nèl)
```html
<link rel="stylesheet" href="[Link]">
```
---
# 📌 KONSEP CSS DE BAZ
## Selecto r
```css
p{
co lo r: red;
}
```
## Id
```css
#menu {
backgro und: black;
}
```
## Class
```css
.bo x {
11 / 12
4/12/26, 10:58 PM
co lo r: white;
}
```
---
# 📘 BON PRATIK POU VIN PRO
✔️Endente kò d
✔️Pa melanje dezò d
✔️Itilize semantic
✔️Fè kò d la klè
✔️Pratike chak jo u
12 / 12