CSS Exercices

Affûtez vos compétences en feuilles de style en cascade (CSS) à travers une série d'exercices pratiques. Cette collection de défis concrets est conçue pour tester et améliorer votre compréhension des concepts fondamentaux du CSS. Chaque exercice présente un problème de stylisation réel, vous permettant d'appliquer vos connaissances des sélecteurs, des propriétés, des modèles de mise en page comme Flexbox et Grid, et des principes de conception réactive. Parcourez ces tâches de codage pour renforcer votre confiance et votre maîtrise de la stylisation des pages web.

Votre premier laboratoire CSS

Votre premier laboratoire CSS

Bonjour et bienvenue sur LabEx! Dans ce premier laboratoire, vous allez apprendre le programme classique 'Hello, World!' en CSS.
LabCSS
Cube 3D en rotation

Cube 3D en rotation

Dans ce laboratoire, nous allons créer un cube 3D en rotation en utilisant HTML et CSS. Ce cube aura des faces colorées et tournera indéfiniment, créant un effet visuellement attrayant. Nous vous guiderons à chaque étape du processus pour vous aider à construire ce projet depuis le début.
LabCSS
Animations et transitions

Animations et transitions

Dans le monde animé de 'Pet's House', un sanctuaire virtuel pour les amateurs de bêtes, Taylor, un créatif concepteur web, entreprend un voyage pour infuser de la vie dans le site web.
LabCSS
Bases du CSS et Sélecteurs

Bases du CSS et Sélecteurs

Dans ce laboratoire, vous prendrez les devants en tant que développeur web chargé de créer un site web élégant pour un service d'animal de compagnie en utilisant les techniques et les sélecteurs de base du CSS.
LabCSS
Modèle de boîte CSS et marges

Modèle de boîte CSS et marges

Dans le paysage numérique animé de 'Pet's House', un site web dédié à la prestation de services de soins premium pour les animaux, notre protagoniste, Jordan, un talentueux développeur web, est chargé d'améliorer la mise en page et la conception du site.
LabCSS
Site web responsive de Pet's House avec Flexbox

Site web responsive de Pet's House avec Flexbox

Dans la ville animée de Petville, Jordan, un développeur web, est chargé de redessiner le site web 'Pet's House'.
LabCSS
Présentation des services pour animaux de compagnie avec la grille CSS

Présentation des services pour animaux de compagnie avec la grille CSS

Dans 'La Maison des Animaux', un univers virtuel pour les amateurs d'animaux, Alex, un développeur web, entreprend une quête pour moderniser la présentation de leurs services en utilisant la grille CSS.
LabCSS
Amélioration du logiciel de suivi des finances personnelles

Amélioration du logiciel de suivi des finances personnelles

Dans ce laboratoire, le parcours d'Alex dans le développement du logiciel de suivi des finances personnelles entre dans une étape avancée, en mettant l'accent sur l'amélioration de l'interactivité de l'application grâce à des techniques sophistiquées de gestion d'événements. La scène est mise dans une session de brainstorming au sein de la startup technologique, où Alex propose d'ajouter une fonctionnalité de glisser-déposer pour réordonner les enregistrements financiers. Cet objectif ambitieux vise à offrir aux utilisateurs un moyen intuitif d'organiser leurs enregistrements, reflétant la nature fluide de la gestion des finances personnelles. Pour y arriver, Alex doit explorer les événements DOM avancés et manipuler les éléments de manière à être à la fois visuellement attrayante et conviviale pour l'utilisateur.
LabCSS
Modèle de boîte CSS

Modèle de boîte CSS

Dans ce laboratoire, vous apprendrez les bases du modèle de boîte CSS (CSS Box Model), y compris le contenu, le padding, la bordure et la marge, ainsi que comment contrôler le dimensionnement des éléments avec box-sizing.
LabCSS
Couleurs et Arrière-plans CSS

Couleurs et Arrière-plans CSS

Dans ce laboratoire, vous apprendrez à styliser les éléments d'une page web en appliquant diverses propriétés CSS de couleur et d'arrière-plan, notamment la définition des couleurs, l'ajout d'images et le contrôle de leur position et de leur répétition.
LabCSS
Introduction et liaison CSS

Introduction et liaison CSS

Dans ce laboratoire, vous apprendrez les bases du CSS, y compris comment créer une feuille de style externe et la lier à un document HTML pour changer la police de la page.
LabCSS
Bases des sélecteurs CSS

Bases des sélecteurs CSS

Dans ce laboratoire, vous apprendrez les bases des sélecteurs CSS, y compris les sélecteurs d'élément, de classe, d'ID, de regroupement et descendants pour styliser les éléments HTML.
LabCSS
Stylisation de texte CSS

Stylisation de texte CSS

Dans ce laboratoire, vous apprendrez les bases de la stylisation de texte CSS, y compris comment définir la couleur du texte, la taille de la police, la graisse de la police, l'alignement et la hauteur de ligne.
LabCSS