Loading…
Transcript

HTML

INTRODUCTION

HTML est un langage de programmation pour creer un site Web

Il est compatible avec d'autres langages comme le CSS ou le JavaScript

Il se divise entre deux parties majeures:

la tete <head> et le corps <body>

Vous inscrirez tous les codes dans le BlockNote de l'accessoire Windows

<html><head>

</head><body>

</body></html>

structure de base

Tous les codes doivent etre fermes dans l'HTML

La fermeture s'effectue en reprenant le premier mot du code avec le signe / avant

Exemple:

ouverture du code 'ecriture en rouge'

<font color="red">

fermeture de ce meme code

</font>

Regles de base

L'ordre s'applique a la maniere d'un LIFO

(Last In First Out)

Donc les codes ouverts en derniers seront fermes en premier

Ex:

<b><i><u>Hello</u></i></b>

ordre de fermeture

Ces codes n'ont pas besoin d'etre fermes:

  • <br> passer a la ligne suivante
  • <p> sauter une ligne
  • <hr> dresser une ligne
  • <img src> introduire une image

quand la fermeture est inutile

Ils se situent entre les codes

<head> et </head>

<title> donner un titre a votre page

<meta> instruction a Internet de retrouver votre site avec des mots clefs

ex: <head><title>Mon site</title></head>

les codes dans la tete

Code META

Mot clef pour trouver votre site:

<meta name="keywords" content="mots clefs a mettre ">

Signer comme auteur de la page

<meta name="author" content="votre nom ">

Liste des codes entre les codes <body> et </body>

  • <font color="blue">: ecriture en bleu
  • <b>: ecriture en gras
  • <i>: ecriture en intalique
  • <u>: soulignement
  • <img src="image.jpg">: mettre une image
  • <a href="www.google.ca">: creer un lien
  • <p>: sauter une ligne
  • <br>: revenir a la ligne
  • <hr>: ligne horizontale
  • <ul>: liste indenombrable suivi de <li>
  • <ol>: liste denombrable suivi de <li>
  • <table>: faire un tableau suivi de <tr> puis <td>

les codes dans le corps

Les dimensions peuvent changees:

<img src="image.jpg" width=200 height=200>

les images

On peut mettre des bordure au tableau

<table border=20> et espacer les cellules entre elles

<table cellspacing=20> ou combiner le tout

<table border=20 cellspacing=20>

les tableaux

On peut agrandir le code <body> en ajoutant soit

une couleur d'arriere plan

<body bgcolor="yellow">

ou une image <body background="image.jpg">

L'ARRIERE PLAN

Quand vous enregistrer le travail, vous devez le nommer: index.html

Internet reconnait la page index comme la premiere page a ouvrir dans un site

voir le resultat

video