Maîtrisez les Propriétés CSS : Padding et Border

Le modèle de boite CSS : bordures et padding
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Apprendre XHTML & CSS
Revoir le teaser Je m'abonne
3,0
Transcription

59,90€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

DescriptionProgrammeAvis
3,0
59,90€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

À la fin de cette vidéo, vous devriez être capable de :

  • Utiliser la propriété padding pour créer des espacements internes dans les éléments HTML.
  • Appliquer des bordures autour des éléments HTML en utilisant la propriété border.
  • Comprendre et manipuler les sous-propriétés de padding et de border.

Apprenez à utiliser la propriété padding pour créer des espacements internes et la propriété border pour ajouter des bordures autour de vos éléments HTML.

Dans cette leçon, nous allons explorer l'utilisation des propriétés CSS padding et border. La propriété padding permet de définir des espacements internes au sein des éléments, fournissant ainsi un retrait entre le contenu de l'élément et ses bordures. Cette fonction est particulièrement utile pour garantir que le texte ne soit pas collé aux bords lorsque l'élément a un fond coloré ou une image d'arrière-plan.

Nous examinerons également les différentes sous-propriétés de padding telles que padding-top, padding-right, padding-bottom, et padding-left, permettant de contrôler indépendamment les espacements de chaque côté d'un élément. Il est important de noter que les espacements padding ne fusionnent pas, contrairement aux marges.

Ensuite, nous introduirons la propriété border, qui permet de créer des bordures autour des éléments HTML. Nous explorerons différentes valeurs pour border-style telles que solid, dashed, dotted et double, chacune offrant des styles de bordures distincts. De plus, nous verrons comment utiliser border-color pour définir la couleur des bordures et border-width pour spécifier leur largeur. Vous découvrirez également comment utiliser la syntaxe raccourcie de la propriété border pour une configuration plus concise des bordures.

Voir plus
Questions réponses
Quelle est la différence entre padding et margin en CSS ?
La différence principale est que la propriété padding concerne les espacements internes à l'élément, tandis que la propriété margin s'applique aux espacements externes entre les éléments.
Comment spécifier des bordures différentes sur chaque côté d'un élément ?
Vous pouvez utiliser les sous-propriétés border-top, border-right, border-bottom et border-left pour définir des bordures distinctes pour chaque côté d'un élément.
Qu'arrive-t-il si on utilise padding avec une valeur incorrecte en CSS ?
Si vous utilisez une syntaxe incorrecte pour la propriété padding, cette propriété sera tout simplement ignorée par le navigateur, et aucun espacement interne ne sera appliqué.

Programme détaillé

1 commentaire
3,0
1 vote
5
4
3
2
1
wfischli
Il y a 2 years
Commentaire
Dans l'ensemble bon cours, toutefois pas adapté au débutant car très touffu.
Je me perds toujours dans les marges, les paddings et les positionnements!
Beaucoup de petites astuces, bienvenues.
Gros défaut: tous les écrans sont flous, et le son est exécrable.