CSS (Cascading Style Sheets)

CSS (Cascading Style Sheets) est le langage de feuilles de style utilisé pour décrire la présentation des documents HTML et XML. Il contrôle la mise en page, les couleurs, les polices, les animations et le design responsif sur l'ensemble du web.

Type MIME

text/css

Type

Texte

Compression

Sans perte

Avantages

+ Separates presentation from content (HTML)
+ Powerful layout systems: Flexbox, Grid, and container queries
+ Custom properties enable theming and dynamic values
+ Media queries enable responsive design for all screen sizes

Inconvénients

− Global scope can cause unintended style conflicts
− Browser compatibility differences require testing
− No native variables before custom properties (pre-2017)

Quand utiliser .CSS

Utilisez CSS pour tout le stylisme web. Considérez les préprocesseurs (Sass, Less) pour les projets complexes ou les frameworks utilitaires (Tailwind CSS) pour le prototypage rapide. Le CSS natif est de plus en plus capable avec l'imbrication et les container queries.

Détails techniques

CSS utilise des sélecteurs et des blocs de déclarations (propriété: valeur). La spécificité détermine les priorités des règles (inline > ID > classe > élément). Les fonctionnalités modernes incluent les propriétés personnalisées (var()), calc(), les container queries et l'imbrication (natif en 2024).

Historique

Håkon Wium Lie a proposé CSS en 1994 et la première spécification W3C (CSS1) a suivi en 1996. CSS2 (1998) a ajouté le positionnement et les media types. CSS3 (en cours) a introduit le module Flexbox, Grid, les variables personnalisées et les animations.

Convertir depuis .CSS

.css → .html .css → .js .css → .json .css → .jsx .css → .less .css → .scss .css → .ts .css → .tsx

Convertir en .CSS

.html → .css .js → .css .json → .css .jsx → .css .less → .css .scss → .css .ts → .css .tsx → .css

Formats associés

.c .cpp .csv .go .java .js .json .jsx .less .py .rs .scss .sql .toml .ts .tsv .tsx .xml .yaml .yml

Termes associés

Aspect Ratio (CSS) BEM Calc Cascade Color Function CSS max() CSS min() CSS Nesting Selector CSS Paint API CSS Scope Custom Properties Inheritance Data URI EPUB Keyframe Animation lab() Layer Nesting Popover Specificity Stacking Context

Learn More

CSS Units Explained: px, em, rem, vh, and When to Use Each

CSS offers over a dozen length units, each suited to different situations. Understanding the differences between absolute and relative units …

JSON vs YAML vs TOML: Choosing a Configuration Format

Configuration files are the backbone of modern applications. JSON, YAML, and TOML each offer different trade-offs between readability, complexity, and …

Flexbox vs CSS Grid: A Practical Comparison

Flexbox and CSS Grid are complementary layout systems, not competitors. This guide clarifies when to reach for each one and …

How to Format and Validate JSON Data

Malformed JSON causes silent failures in APIs and configuration files. Learn how to format, validate, and debug JSON documents to …

Base64 Encoding: How It Works and When to Use It

Base64 converts binary data into ASCII text, making it safe for transmission through text-based systems. Learn when Base64 is the …

How to Create CSS Gradients: Linear, Radial, and Conic

CSS gradients create smooth color transitions without image files. Learn to build linear, radial, and conic gradients with precise control …

Cas d'utilisation

T Minifying and Optimizing CSS for Production Deployment