Cheatography
https://cheatography.com
Petit Cheat Sheet sur les principals balises HTML et CSS
HTML
<!DOCTYPE html> |
Début |
<html> |
Document HTML |
Section
<header> |
Entête du site |
<footer> |
Pied du site |
<nav> |
Elément de naviguation |
<main> |
Menu principal |
<section> |
Groupement thématique de contenu, généralement avec un en-tête, titre |
<article> |
Contenu autonome dans une page message sur un forum, un article de blog, ... |
<aside> |
Contenu qui indirectement lié, en marge du sujet principal, voir même sans rapport |
CSS
color |
choisir la couleur |
font-family |
police de texte |
font-size |
taille de texte |
font-style |
italique,... |
font-weight |
epaisseur de police |
line-height |
hauteur de la ligne |
text-decoration |
modifie le soulignement des liens |
text-align |
place le texte |
text-transform |
majuscule,minuscule |
letter-spacing |
espacer, diminuer l'espace du texte |
overflow |
permet de pas faire sortir le contenu |
max-width |
taille maximum |
min-width |
taille minimum |
|
|
Tableau
<table> |
Tableau |
<caption> |
Titre du tableau |
<thead> |
Entête du tableau |
<tbody> |
Corps du tableau |
<tfoot> |
Pied du tableau |
<tr> |
Ligne du tableau |
<th> |
Cellule d'entête |
<td> |
Cellule de donnée |
colspan |
Fusion de cellule en colonne |
rowspan |
Fusion de cellule en ligne |
Liens, ancre et dossier
<a href="https..."> </a> |
<a href=""> </a> |
"nom-dossier/" |
pour aller dans un dossier |
"../" |
pour sortir d'un dossier |
#... |
ancre |
Image
<img> |
élément image |
scr = "" |
définit le chemin de l'image |
alt = "" |
texte définitant l'image |
height = "" |
hauteur de l'image en pixel |
width = "" |
largeur de l'image en pixel |
<title> |
"Définition" de l'image |
|
|
Balise de base
<p> |
Paragraphe |
<q> |
pour les citations |
<head> |
Info que l'utilisateur ne voit pas |
img scr= |
Dit où est l'image |
<imput... |
Champs de saisit |
<h1> |
Titre 1 |
sémantique |
Donne un sens à un titre |
.. required > |
Champs de saisit obligatoire |
<br> |
Pousse un mot à la ligne |
<hr> |
Fait une ligne et un retour à la ligne dessus et dessous du texte |
<ul> |
Liste à puce |
<ol> |
Liste à chiffres |
<li> |
représente un élément d'une liste |
<em> |
Moyenne importance |
<strong> |
très important |
<mark> |
représente du texte surligné |
<del> |
représente du texte qui a été suprimé |
<dfm> |
définition d'un terme |
<abbr> |
abréviation |
<time> |
date ou heure précise |
<adress> |
élément de contact |
<sub> <sub> |
texte en exposant ou en indice |
<cite> |
contient le titre d'une oeuvre, livre, chanson |
<q> |
petite citation |
<blockquote> |
grande citation |
start |
1er élément de la liste |
<dt> |
Terme à définir |
<dd> |
description |
reversed |
liste inversée |
<a href=""> </a> |
Lien (autre site) |
<a href=""> </a> |
Lien (son site) |
<h3 id=""> </h3> |
pour placer une ancre sur la page |
<a href=""> </a> |
envoi vers une ancre |
target="_blanck" |
ouvre un nouveau onglet |
"mailto:a@b.c" |
ouvre la boite mail |
"tel:0001212498" |
ouvre un numéro de téléphone |
<figcaption> |
défini l'image |
id |
identifiand unique |
class |
classe les élément |
<div> |
groupe du texte dans un block |
<spam> |
groupe du texte dans un inline |
<class "stabilo"...> |
Met en surlingné |
|
Created By
Metadata
Favourited By
Comments
No comments yet. Add yours below!
Add a Comment
Related Cheat Sheets