Header
Partagez | 

[Tuto HTML] Bases du HTML

avatar

Mes clubs


En savoir plus
Mes clubs extra-scolaires:

Zutsky

Doyen
Bons Points (BP) : 60
Voir le profil de l'utilisateur

Message Sujet: [Tuto HTML] Bases du HTML   Jeu 20 Nov - 18:02

Hello ^^

Voici un petit tuto pour vous familiariser avec le HTML...

Kézako ?

"HTML" signifie "HyperText Markup language". Le HTML est un langage de programmation utilisé dans toutes les pages Web, de petits sites aux grands forums... Bon, j'vais pas vous ennuyer longtemps et en plus j'ai la flemme lol!

Le HTML est codé en balises. Une balise est un code, tapé entre "<" et ">", contrairement au BBCode qui s'écrit entre crochets.
Par exemple, pour mettre un texte en gras, on va mettre on va entourer le mot désiré comme ceci :
Code:
<b>Texte en gras</b>

Ici, le est la balise de début, qui donne le point de départ du gras, et la balise de fin.

On peut faire ceci avec toutes les balises, les principales sont répertoriées sur ce tableau :

 
La taille de caractères doit se faire comme suit : Blabla Le dexte Blabla en +4 grossira le texte beaucoup, alors qu'en -1, il sera légèrement diminué.


Il existe cependant des balises auto-fermentes, comme la balise d'image, c'est-à-dire qu'elles n'ont pas de balise de fin. (comme par exemple ) Elles ont un espace, puis un slash, et un signe supérieur :
Pour insérer une image, on mettra donc :
Code:
<img src="lien URL de l'image" />






Un exemple de code de page :

Code:
<html>
<head>
<title>Titre de la page</title>
</head>

<body>

<font size="+1" color="blue" face="Times New Roman">Bonjour ! Voici ma page HTML =)</font>
<br><br>
Blabla...

</body>
</html>


Ce qui va donner :
Citation :

Bonjour ! Voici ma page HTML =)

Blabla...

Enregistrer une page

Pour enregistrer une page HTML visible ensuite par l'ouverture du fichier dans votre navigateur Internet, agissez comme suit :
- Ouvrez le bloc-notes Windows.
- Créez ou copiez-collez la structure du document HTML (html, body, etc.) puis mettez le contenu désiré.
- Faites "Fichier >> Enregistrer sous..."

Ensuite, Nom du fichier : pagetest.HTML ; Type de fichier : Tous les fichiers. Si vous laissez en *.txt, vous aurez beau mettre l'extension HTML, votre fichier restera un simple texte !

Voilà, votre code est enregisté !



Notes

  1. Dans un code HTML, vous pourrez toujours appuyer sur ENTER, il n'y aura pas de saut de ligne sur la page au final... Pour cela, comme le HTML ne comprend que le texte brut et les balises, il faut lui dire de sauter une ligne par une balise :
    ou


  2. Pour voir le code source d'une page, il suffit juste de cliquer sur "Affichage" en haut, puis "Source" ou "CTRL + U" au clavier. Vous pouvez aussi aller dans le dossier où vous avez enregistré le code et faire "Ouvrir avec" sur le nom du fichier (avec le Bloc-notes). Si c'est une page de votre ordinateur, vous pouvez modifier le code et l'enregistrer ! Actualisez alors la page, elle est changée =)

  3. Il faut faire attention à bien refermer les balises, dans le bon ordre. si par exemple, vous voulez mettre un texte en gras et italique en même temps (Shocked) vous allez mettre
    Code:
    <i><b>Texte en gras italique</b></i>
    Mais pas
    Code:
    <i><b>Texte en gras italique</i></b>
    .
    En fait, il faut refermer les balises de façon symétrique : bi ib (sans oublier les / de fin)

    Vous pouvez commencer par la balise que vous souhaitez, ce qui importe est que ça soit dans le bon ordre ....



Voilà, j'espère que je ne vous ai pas trop ennuyés, si vous avez des questions ou des problèmes n'hésitez pas à me demander... Je pense faire par la suite des tutos un peu plus détaillés sur des thèmes du codage HTML (mise en page, tableaux, etc.), en attendant vous pouvez vous amuser sur ce site : http://www.siteduzero.com/

A bientôt !



Vous rencontrez un souci avec ce tutoriel ? Venez poser votre question [ici].

Idea N'oubliez pas de lire et de suivre les [règles de la section].

Je soussigné, Zutsky,  accepte qu'un directeur reposte le tutoriel "Bases du HTML" tel que je l'ai rédigé.


Dernière édition par Miettes le Jeu 26 Mai - 15:23, édité 9 fois (Raison : Re-mise en page du tuto... Enjoy ^^)
Revenir en haut Aller en bas
[Tuto HTML] Bases du HTML
Page 1 sur 1
Réponse rapide

School of Progress :: La bibliothèque :: Tutoriels :: Informatique :: Codage+