Ce guide des styles CSS vous fournit un plan des styles de publication et de page par défaut pour démarrer. Ce guide, qui s’applique aux sites Web Tepeek, est également une excellente référence pour le traitement typographique et les styles suggérés pour que votre site Web se distingue.
L’importance des titres d’une page Web
Titre de niveau 1
Titre de niveau 2
Titre de niveau 3
Titre de niveau 4
Titre de niveau 5
Titre de niveau 6
Blockquote
Le blockquote est utilisé pour indiquer une citation d’une section de texte d’une autre source. Cela peut être aussi long ou aussi court que vous le souhaitez !
Ceux d’entre nous qui étaient restés debout toute la nuit n’étaient pas d’humeur pour le café et les beignets, nous voulions une boisson forte. Nous étions, après tout, la crème absolue de la presse numérique nationale.
Position des citations
Pour positionner votre citation, il vous suffit d’ajouter une classe de pull-right ou pull-left à votre contenu. Cela peut être fait dans la vue de l’éditeur de texte. Voici un exemple :
<span class="pull-right">Positionne cette citation à droite.</span>
Cette citation est simplement accrochée sur le côté droit du message. Lorem ipsum dolor sit amet, consectetur.
Une position de citation (également connue sous le nom de citation en retrait) est une citation ou un extrait d’un article qui est généralement placé dans une police plus grande ou distincte sur la même page, servant à attirer les lecteurs dans un article ou à mettre en évidence un sujet clé. Le terme est principalement utilisé dans le journalisme et l’édition.
Le placement d’une citation sur une page peut être défini dans le guide de style d’une publication ou d’un site Web. Un tel dispositif typographique peut ou non être aligné avec une colonne de la page. Certains concepteurs, par exemple, choisissent de ne pas aligner la citation. Dans ce cas, la citation se découpe en deux colonnes ou plus, comme dans l’exemple illustré.
Et cette citation est placée à gauche. Lorem ipsum dolor sit amet, consectetur.
Les guillemets ne doivent pas nécessairement être une copie textuelle du texte cité ; selon le style maison d’une publication, les citations peuvent être abrégées pour l’espace et/ou paraphrasées pour plus de clarté, avec ou sans indication. Il n’y a pas de règles strictes pour le formatage exact des guillemets.
Éléments de liste mixtes
- Élément de liste non ordonné 1
- Élément de liste non ordonné 2
- Élément de liste ordonné 1
- Élément de liste ordonné 2
- Élément de liste non ordonné 1
- Élément de liste non ordonné 2
- Élément de liste ordonné 1
- Élément de liste ordonné 2
- Élément de liste ordonné 3
- Élément de liste non ordonné 3
- Élément de liste ordonné 3
- Élément de liste non ordonné 3
Formatage de code
pre {
position: relative;
background: #f7f7f7;
font-family: "Courier 10 Pitch", Courier, monospace;
font-size: 15px;
font-size: 1.5rem;
line-height: 1.6;
margin-bottom: 1.6em;
padding: 1.6em;
overflow: auto;
max-width: 100%;
tab-size: 4;
}
Styles de tableau
| Révolution Charango | Instrument | Son |
|---|---|---|
| Boris Choquet | Charango | Un jour dans la vie |
| George Harrison | Guitare | Vieille chaussure marron |
| Paul McCartney | Basse | Helter Skelter |
| Ringo Starr | Tambours | Ne me dépasse pas |
Style de texte pour mettre en évidence
Pour utiliser la surbrillance, il vous suffit d’ajouter une étendue avec la classe highlight. Cela peut être fait dans la vue de l’éditeur de texte. Voici un exemple :
<span class="highlight">Cela sera mis en évidence.</span>
Alignement d’image
Image centrée
Image alignée à droite
Les images peuvent être bidimensionnelles, comme une photographie, en plein écran et tridimensionnelles, comme une statue ou un hologramme. Elles peuvent être capturées par des dispositifs optiques – tels que des caméras, des miroirs, des lentilles, des télescopes, des microscopes, etc. ainsi que des objets et phénomènes naturels, tels que l’œil humain ou les surfaces de l’eau.
Image alignée à gauche
Le mot « image » est également utilisé au sens large de toute figure bidimensionnelle telle qu’une carte, un graphique, un camembert ou une peinture abstraite. Dans ce sens plus large, les images peuvent également être rendues manuellement, par exemple par dessin, peinture, sculpture, rendues automatiquement par impression ou technologie d’infographie, ou développées par une combinaison de méthodes.
