Articles populaires – Cours de CSS pour tous

22 janvier 2011

direction

La propriété direction nous permet de définir le sens du texte(gauche à droite, droite à gauche). Les valeurs sont :- ltr : de gauche à droite.- rtl : de droite à gauche.- inherit : hérité. Exemple : p {direction: rtl;} Cette propriété n'as pas beaucoup...

Posté par valdrikr à 14:56 - Commentaires […] - Permalien [#]

Tags: direction, ltr, rtl

Partager cet article

Vous aimez ?

0 vote

18 janvier 2011

Créer un éléments pour l'attribut ID

En html l'attribut id="identifiant" permet d'identifier une balise. Mais attention, un identifiant ne peut être attribuer que sur une seule balise, chaque balises doit donc contenir un identifiant différent. Pour créer un élément pouvant être appelé par...

Posté par valdrikr à 15:42 - Commentaires […] - Permalien [#]

Tags: id, identifiant

Partager cet article

Vous aimez ?

0 vote

13 janvier 2011

L'asterisque = élément universel

L'élément universel est désigné par une astérisque (*). Celui-ci nous permet d'attribuer la même valeur à toutes nos balises. Exemple : * {font-size: 12px;font-family: Verdana, Arial, Helvetica, sans-serif;} Donc tout le texte de votre page prendra une...

Posté par valdrikr à 20:55 - Commentaires […] - Permalien [#]

Tags: asterisque, element universel

Partager cet article

Vous aimez ?

0 vote

20 janvier 2011

text-align

Si vous voulez aligner le texte au centre, sur la gauche, la droite ou justifié il vous faut utiliser la propriété text- align. Les valeurs pouvant être appliqué sont :- center : texte centré.- right : texte à droite.- left : texte à gauche(valeur par...

Posté par valdrikr à 16:32 - Commentaires […] - Permalien [#]

Tags: text-align

Partager cet article

Vous aimez ?

0 vote

21 janvier 2011

letter-spacing

letter-spacing définit la taille de l'espace entre les lettres de chaque mots. valeurs :- normal : valeur par défaut.- px : en pixels. - em : unité relative.- inherit : hériter de l'élément parent. Note : la valeur peut être négative afin de réduire l'espace...

Posté par valdrikr à 18:34 - Commentaires […] - Permalien [#]

Tags: letter-spacing

Partager cet article

Vous aimez ?

0 vote

1 février 2011

font-size

Pour définir la taille d'un texte il faut utiliser la propriété font-size. Vous pouvez indiquer la taille en pixels, mais certaine webmasters préfèrent d'utiliser une taille relative comme les "em", car cette unité s'adapte à la configuration du navigateur...

Posté par valdrikr à 20:15 - Commentaires […] - Permalien [#]

Tags: font-size

Partager cet article

Vous aimez ?

0 vote

20 janvier 2011

La propriété color

Comme son nom l'indique, il s'agit de la propriété pouvant changer la couleur du texte. Cette propriété peut être spécifier de divers manière. Si vous voulez attribuer une couleur pour tout le texte de votre page, vous pouvez soit utiliser la propriété...

Posté par valdrikr à 13:38 - Commentaires […] - Permalien [#]

Tags: css color

Partager cet article

Vous aimez ?

0 vote

11 janvier 2011

Introduction

Le CSS à pour but de séparer le contenu de vos documents html et la mise en page, afin de rendre le tout plus clair et facile à modifier par la suite. De plus grâce au CSS il vous suffit de créer un seul document CSS que vous pourrez utiliser sur toutes...

Posté par valdrikr à 20:30 - Commentaires […] - Permalien [#]

Tags: introduction css

Partager cet article

Vous aimez ?

0 vote

11 janvier 2011

Syntaxe CSS

Le CSS se compose avant tout d'un élément à qui ont donne une propriété, ensuite une valeur est affecté à la propriété : élément {propriété1 : valeur(s);propriété2 : valeur(s);.....} Comme vous le voyez un élément peut contenir une ou plusieurs propriété....

Posté par valdrikr à 22:38 - Commentaires […] - Permalien [#]

Tags: syntaxe css

Partager cet article

Vous aimez ?

0 vote

14 janvier 2011

Grouper les éléments

Comme expliquer plus tôt, un style css se compose d'un élément à qui on attribue une propriété. Mais que faire lorsque l'ont veut appliquer les mêmes propriété à plusieurs éléments? Il suffit de les grouper en les séparant par une virgule. Par exemple...

Posté par valdrikr à 20:21 - Commentaires […] - Permalien [#]

Tags: grouper elements css

Partager cet article

Vous aimez ?

0 vote

18 janvier 2011

Attribuer plusieurs style sur un même éléments avec les CLASS

Imaginons que votre page se sépare en deux parties, l'une sur fond sombre et l'autre sur fond clair, bien entendu vous ne pourrez pas utiliser la même couleur pour les deux textes, cela rendrait l'un des deux textes difficile, voir impossible a lire....

Posté par valdrikr à 16:01 - Commentaires […] - Permalien [#]

Tags: class

Partager cet article

Vous aimez ?

0 vote

20 janvier 2011

vertical-align

Si vous voulez aligner le texte sur la verticale vous devez utiliser la propriété vertical-align. Les valeurs sont :- top : sera aligné avec le dessus du l'élément parent.- bottom : aligné avec le bas de l'élément parent.- middle : aligné avec le milieux...

Posté par valdrikr à 16:42 - Commentaires […] - Permalien [#]

Tags: vertical-align

Partager cet article

Vous aimez ?

0 vote

20 janvier 2011

text-decoration

La propriété text-decoration nous permet de changer la décoration du texte. les valeurs sont :- none : pas de décoration (valeur par défaut).- blink : texte clignotant.- underline : texte souligné.- overline : une ligne au dessus du texte.- line-through...

Posté par valdrikr à 16:53 - Commentaires […] - Permalien [#]

Tags: text-decoration

Partager cet article

Vous aimez ?

0 vote

21 janvier 2011

text-transform

La propriété text-transform nous permet de changer la capitalisation du texte. les valeurs sont :- uppercase : texte en majuscules.- lowercase : texte en minuscules.- inherit : propriété hérité de l'élément parent.- capitalize : seul la première lettre...

Posté par valdrikr à 16:26 - Commentaires […] - Permalien [#]

Tags: text-transform

Partager cet article

Vous aimez ?

0 vote

24 janvier 2011

word-spacing

Comme pour letter-spacing la propriété word-spacing nous permet de définir la taille de l'espace, mais cette fois-ci entre les mots et non entre les lettres. Les valeurs peuvent être exprimé en %, em, px, pt.. Exemple : h1 {word-spacing: 12px;} Résultat...

Posté par valdrikr à 16:44 - Commentaires […] - Permalien [#]

Tags: word-spacing

Partager cet article

Vous aimez ?

0 vote

25 janvier 2011

white-space

La propriété white-space définit comment le navigateur doit interpréter les espaces blancs. Valeurs :- nowrap : pas de retour à la ligne. Le texte continue même si il dépasse le bloc.- pre : le texte est affiché comme il a été écrit. (même fonction que...

Posté par valdrikr à 16:02 - Commentaires […] - Permalien [#]

Tags: white-space

Partager cet article

Vous aimez ?

0 vote

29 janvier 2011

font-family

Pour définir la police de caractères nous devons utiliser la propriété "font-family" : Exemple : body {font-family : Verdana, Arial, 'Trebuchet MS', sans-serifs;} Comme vous le voyez, ont peut insérer plusieurs police de caractères dans une même propriété....

Posté par valdrikr à 23:46 - Commentaires […] - Permalien [#]

Tags: font-family

Partager cet article

Vous aimez ?

0 vote

5 février 2011

font-style

Pour définir le style d'une police de caractères nous devons utiliser la propriété font-style. Les valeurs pouvant être appliqué sont :- normal : pas de style (valeur par défaut).- italic : texte en italique.- oblique : texte en oblique.- inherit : le...

Posté par valdrikr à 16:15 - Commentaires […] - Permalien [#]

Tags: font-style

Partager cet article

Vous aimez ?

0 vote

14 février 2011

font-weight

Pour définir un texte en gras nous devons utiliser la propriété font-weight. Les valeurs pouvant être appliqué sont : - 100 à 900 : par tranche de 100, ceci nous offre un éventails d'épaisseur de texte dont 100 sera le moins épais et 900 le plus gras(400...

Posté par valdrikr à 16:20 - Commentaires […] - Permalien [#]

Tags: font-weight

Partager cet article

Vous aimez ?

0 vote

15 février 2011

border-style

Avec la propriété border-style, nous pouvons ajouter des bordures à nos texte. Ce type de bordure n'est pas seulement utilisé pour les tableaux mais peut aussi être ajouter à des paragraphes, division, etc. Il existe plusieurs style de bordure dont voici...

Posté par valdrikr à 15:14 - Commentaires […] - Permalien [#]

Tags: border-style

Partager cet article

Vous aimez ?

0 vote

21 janvier 2011

text-intend

La propriété text-intend nous permet de décaler le début du texte. .class { text-indent: 25px;} Note : peut être définis en px, % , cm, em,.. Voila ce que ça donne : En 1815, M. Charles-François-Bienvenu Myriel était évêque de Digne. C’était un vieillard...

Posté par valdrikr à 16:44 - Commentaires […] - Permalien [#]

Tags: text-intend

Partager cet article

Vous aimez ?

0 vote

14 février 2011

font-variant

La propriété font-variant nous permet d'afficher un texte en petites lettres capitales. Mais attention, toutes les polices n'ont pas cette variante de lettre. Exemple p.class1 {font-variant : small-caps;} texte en small-caps texte sans font variant Les...

Posté par valdrikr à 16:18 - Commentaires […] - Permalien [#]

Tags: font-variant

Partager cet article

Vous aimez ?

0 vote