Mise en page & CSS Noyau C · Convention industrielle

Spacing

Espacement

L'espacement est un espace vide placé intentionnellement. Il regroupe les éléments connexes, sépare les idées et donne un rythme à la page.

Vous pourriez l'appeler Spacingespace blancespace négatif

Voir comment cela fonctionne

Exemple travaillé originalEspacement

Un autre exemple

Une étiquette est placée près de son champ de saisie. Un plus grand espace sépare une section de formulaire de la suivante.

Parties principales

  1. 01Outer constraint
  2. 02Content and spacing model
  3. 03Computed size or reflow result

Utilisez-le lorsque

Utilisez l'espacement pour montrer quels éléments vont ensemble avant d'ajouter des bordures ou des encadrés.

Ne l'utilisez pas lorsque

Ne jamais donner à chaque élément le même espacement. Des espacements égaux donnent l'impression que les éléments sont également liés.

Nom utilisé dans le code

spacing tokens

Avant d'expédier

Check content order, shared design values, component consistency, contrast, zoom, and layout changes by screen size. Verify every theme, language, and state. If there is motion, offer an equal reduced-motion experience.

Demande que vous pouvez copier

Outcome: Complete the task with Espacement (Spacing). User context: Une étiquette est placée près de son champ de saisie. Un plus grand espace sépare une section de formulaire de la suivante. Design concept to apply: Espacement (Spacing). Why it fits: Utilisez l'espacement pour montrer quels éléments vont ensemble avant d'ajouter des bordures ou des encadrés. Do not use it when: Ne jamais donner à chaque élément le même espacement. Des espacements égaux donnent l'impression que les éléments sont également liés. Design requirements: Set the content order, shared design values, and reusable components. Define how the layout changes by screen size and state. Keep useful design choices separate from decoration. Inclusion and resilience: Check contrast, zoom, languages, themes, and reduced motion when needed. Do not use color or effects as the only way to show meaning. Acceptance criteria: The design stays clear on phones and desktops, at zoom, in every theme, and in all supported languages. Interactive states stay clear and consistent. Evidence and limits (evidence boundary): Aucun standard officiel unique ne régit l’ensemble du terme. Sa signification peut varier selon les équipes, plateformes ou frameworks. Unknowns to confirm: Brand limits, amount of content, supported themes and languages, target devices, and design-system rules.

Vérifiez cette demande

Review how Espacement (Spacing) is used now. Definition: L'espacement est un espace vide placé intentionnellement. Il regroupe les éléments connexes, sépare les idées et donne un rythme à la page. Release checks: Check content order, shared design values, component consistency, contrast, zoom, and layout changes by screen size. Verify every theme, language, and state. If there is motion, offer an equal reduced-motion experience. Before changing code, list the evidence, gaps, severity, and the smallest safe fix.

C
Ce terme est-il officiel ?

Convention industrielle

Les gens utilisent souvent ce terme au travail. Les sources listées peuvent soutenir la pratique ou les limitations. Elles ne définissent pas toutes les parties du terme.

Aucun standard officiel unique ne régit l’ensemble du terme. Sa signification peut varier selon les équipes, plateformes ou frameworks.

Portée
Seulement ce que couvre la source:nom canonique、définition、sémantique、mise en œuvre
Statut du document
brouillon
Coché activé
2026-07-30

Sources et portée des preuves

Source faisant autorité · W3C CSS Working Group · brouillon CSS Box Model Module Level 4 Portée: nom canonique、définition、sémantique、mise en œuvre Rôle ici: Contexte utile, pas une définition La source couvre: nom canonique, définition, sémantique, mise en œuvre Source faisant autorité · Design Tokens Community Group · rapport final de la communauté Design Tokens Format Module 2025.10 Portée: nom canonique、définition、sémantique、mise en œuvre Rôle ici: Contexte utile, pas une définition La source couvre: nom canonique, définition, sémantique, mise en œuvre

Copiez-le vous-même

Le navigateur n'a pas pu copier ceci. Sélectionnez la requête ci-dessous et copiez-la vous-même.