Html Cheat Sheet

De Wiki. Analyse, Communication, Développement, Hacking.
Aller à : navigation, rechercher

Cheat Sheet HTML et HTML5

Description de la page : Programmation HTML, langage de développement web, développer un code source simple avec des balises encore appelés tags.

Webmaster, vos valeurs et vos attributs en HTML.

Exemples en HTML

Exemple de déclaration de doctype

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.1 Transitional//EN">
<title>Le titre de la page</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-15">
<meta name=description content="Description de la page.">
<meta name=keywords content="mots, clés, séparés, par, une, virgule">
<meta name=author content="Nom de l'auteur">
<meta name=copyright content="Copyright du site">
<meta name="reply-to" content="Mail pour contacter le responsable du site.">
<meta name="creation_date" content="jj/mm/aaaa">
<meta http-equiv=Content-Language content="fr">
<meta name=generator content="Outil logiciel ou CMS utilisé pour créer le site.">
<meta name=robots content="all">


Exemple de formulaire en HTML

Exemples en HTML5

...

Saisir un pseudo avec HTML5

Ancien comportement avec JavaScript <input type="text" onfocus="javascript: this.value=" onblur="this.value='Entrez un pseudo'" value="Entrez un pseudo">

Avec l'arrivée de HTML5, la syntaxe se simplifie <input type="text" placeholder="Entrez un pseudo">

Source à l'origine de l'article : http://www.alsacreations.com/tuto/lire/1370-formulaire-html5-placeholder-required-pattern.html

Outils logiciels

Un logiciel vous permet de créer gratuitement vos formulaires en HTML : http://formoid.com/fr/?id=fr


Structure HTML de base

Les documents HTML doivent tous avoir une structure minimale. C'est-à-dire des balises qui sont toujours présentes et au milieu desquelles vous allez ajouter votre propre contenu. Ce chapitre présente cette structure en donnant quelques explications sur les mots-clefs principaux (aussi appelés balises).

Voici un exemple de page minimale :

Un lien simple : < a href="https://developer.mozilla.org">Un lien vers MDN< /a>

Une image simple < img src="https://developer.mozilla.org/media/img/mdn-logo-sm.png" />

Un texte avec emphase < em>Je suis distingué< / em>

Un texte marqué comme important < strong>Je suis important< /strong>

Un texte mis en avant < mark>Remarquez-moi< /mark>

Barrer du texte qui n'est plus pertinent < s>Je ne suis plus d'actualité ou plus pertinent< /s>