Styles par défaut
Kuik se base sur la version 8.0.1 de normalize.css.
Styles basés sur les balises HTML
Tous les éléments ci-dessous n'utilisent pas de classes CSS. Les styles appliqués ne sont basés que sur leurs balises.
Texte courant
Ce paragraphe contient du texte d'une importance majeure, mais aussi du texte d'une importance plus modérée. On peut également trouver un lien à l'intérieur. Certains éléments de ce paragraphe ont été rajoutés, tandis que d'autres ont été retirés. On peut également rapporter les paroles de quelqu'un d'autre
et même rappeler que le HTML est une abréviation.
Après avoir effectué un retour à la ligne, on peut rappeler que la balise <code> permet d'afficher un bout de code dans un paragraphe. Il est parfois utile de préciser que l'on définit certains termes au sein même d'une phrase.
Après un nouveau saut de ligne, on peut préciser le rôle de certains raccourcis claviers, tels que Ctrl + R pour recharger une page Web, ou pourquoi pas mettre en valeur des éléments qui étaient recherchés. Espérons que pour arriver sur cette page, vous n'ayez pas eu de message du type Error 404: page not found.Un peu de mathématiques, à présent. Rappelez-vous du théorème de Pythagore qui disait, en substance que : a2 + b2 = c2. Vous préférez la chimie ? Alors voici une formule bien connue : C6H12O6, il s'agit de la molécule de glucose.
Notez que ce texte final, dans un paragraphe séparé, est moins important que le reste et qu'il aura fallu environ pour le rédiger.
Listes à puces
Le paragraphe rédigé ci-dessus fait appel à tout un tas de balises "inline" que l'on peut utiliser au sein d'un paragraphe :
- Des balises pour définir l'importance d'un texte
<strong>pour indiquer qu'une assertion a une importance majeure<em>pour indiquer qu'une assertion a une importance modérée<small>pour indiquer un texte de moindre importance<mark>pour mettre en valeur un élément
- Des balises pour lier, citer d'autres contenus et les contextualiser
<a>pour créer un lien hypertexte<q>pour citer des paroles rapportées<cite>pour citer le titre d'une œuvre<time>pour indiquer une date ou une heure
- Des balises pour la gestion des modifications de texte
<ins>pour indiquer qu'un élément de texte a été ajouté<del>pour indiquer qu'un élément de texte a été retiré
- Des balises pour définir des éléments spécifiques dans le texte
<abbr>pour définir une abréviation<dfn>pour définir un terme
- Des balises pour la mise en page
<br>pour insérer un retour à la ligne
- Des balises pour les contenus plus techniques
<code>pour afficher un bout de code<kbd>pour indiquer une entrée clavier<samp>pour afficher un échantillon de sortie d'un programme<var>pour indiquer une variable
- Et enfin, de quoi aligner correctement des formules scientifiques
<sub>pour afficher un indice<sup>pour afficher un exposant
Listes numérotées
Avec des listes numérotées, on peut établir une table des matières :
- Chapitre premier
- Chapitre second
- Sous-chapitre 2.1
- Sous-chapitre 2.2
- Sous-chapitre 2.3
- Chapitre troisième
- Dernier chapitre
Listes de définitions
- Croissant
- Désigne une pâtisserie faite de pâte feuilletée et de beurre.
- Indique une tendance ayant tendance à s'amplifier.
- Pain au chocolat
- Chocolatine
- Désigne une pâtisserie proche du croissant mais qui possède, en plus, du chocolat.
- Pain au raisin
- Pâtisserie faite de pâte feuilletée, de crème pâtissière et de raisins de Corinthe. Généralement connue pour être la dernière pâtisserie qui reste dans la boîte quand les autres ont été mangées.
Bloc de citation
Quelle est la différence entre un paragraphe et un retour à la ligne ? L'analogie la plus simple consiste à observer la mise en forme d'un poème :
Jonquille du printemps, fleur à la robe jaune
Pointe son doux visage, parfume doucement
L'air des pâturages, la brise également,
Qui siffle lentement, tout près des prés de Beaune.Mottes et après mottes, bien en haut d’un pylône
L’hirondelle enjouée érige vaillamment
Un tendre et douillet nid, qui décore aisément
Un chemin polyglotte, terre de l’avifaune.Contempler ce pays de verdure naissante,
Qui libère ses essences enivrantes,
Symbolise l’immense joie du renouveau.Plus fort que les alcools, il procure l’ivresse
D’un futur approchant, aux soleils estivaux.
Profitons, patience, attendront sécheresses.--K
Un paragraphe correspond ici à une strophe complète. Un retour à la ligne permet de séparer les vers au sein d'une strophe.
Dans un éditeur de texte, lorsque l'on appuie sur la touche Entrée, on crée un nouveau paragraphe, c'est la situation la plus courante et la plus pertinente dans 99% des cas ; pour créer un retour à la ligne, il suffit généralement de taper sur les touches Ctrl + Entrée ou Maj + Entrée selon les éditeurs.
Niveaux de titre
Titre de niveau 1
Titre de niveau 2
Titre de niveau 3
Titre de niveau 4
Titre de niveau 5
Titre de niveau 6
Tableaux
| Prénom | Nom | Ville | Métier |
|---|---|---|---|
| Alfred | Dupont | Paris | Docteur |
| Bérénice | Martin | Brest | Avocate |
| Charles | Thériaux | Strasbourg | Chef cuisinier |
| Diane | Dupuis | Lyon | Directrice |
Bloc de code
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Code minimal d'une page HTML</title>
</head>
<body>
...
</body>
</html>