IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)

Les meilleurs cours et tutoriels pour apprendre le CSS

Les meilleurs cours et tutoriels pour apprendre le CSS

Sélection des meilleurs tutoriels et cours de formation gratuits pour apprendre le CSS du niveau débutant à expert. Vous trouverez les meilleures méthodes éducatives pour une formation agréable et complète ainsi que des exercices intéressants voire ludiques, pour perfectionner votre niveau et acquérir de l'expérience. Si vous voulez directement aller à des questions spécifiques au CSS, n'hésitez pas aussi à vous référer à la FAQ CSS et à poser vos questions sur les forums d'entraide CSS.

Si vous avez des remarques concernant cette page cours et tutoriels pour apprendre le CSS : 3 commentaires Donner une note à l´article (5).

Page lue   fois.

Nombre d´auteurs : 58, nombre d´articles : 98, dernière mise à jour : 23 juillet 2021 

 
Tutoriels pour débutants et cours complets pour apprendre le CSS

Sommaire

menu Débutants
  • PDF on-line ZIP E-book 
    fr
    Je vous propose aujourd'hui un tutoriel pour apprendre les propriétés CSS les plus couramment utilisées. Ce cours présente pour chaque propriété, une définition, la syntaxe, la compatibilité et un exemple.
     
  • PDF on-line ZIP E-book 
    fr
    Ce tutoriel va vous apprendre les trois principes permettant d'appliquer des styles à un élément : la cascade, l'héritage et la spécificité.
     
  • PDF on-line ZIP 
    fr
    Apprendre à améliorer son site avec les standards Web
    par Russ Weakley, Normand Lamoureux (traducteur)
    Ce cours a pour objectif d'apprendre au lecteur comment tirer avantage des standards du web pour améliorer son site et le rendre attrayant aux visiteurs et conforme aux bonnes pratiques.
     
  • PDF on-line ZIP 
    fr
    Le langage CSS (Cascading Style Sheets : Feuilles de Style en Cascade) a été développé par le W3C à partir de 1996. Ce tutoriel, destiné au débutant, va vous apprendre les notions de base du langage CSS.
     
  • PDF on-line ZIP 
    fr
    Balises (X)HTML de base
    par Pascale Lambert
    Pour comprendre le fonctionnement du langage CSS, il est nécessaire d'avoir quelques notions en (X)HTML. Le HTML est un langage simple, fait de balises qui ont toutes une fonction et un sens. Voici un tutoriel pour vous apprendre quelques balises (X)HTML fondamentales à connaître pour comprendre la structure d'une feuille de style.
     
  • PDF on-line ZIP 
    fr
    Feuille de style CSS de base
    par Pascale Lambert
    Une feuille de style CSS externe peut se faire avec le simple bloc-note et il est d'usage de lui faire porter l'extension .css (style.css par exemple). Dans ce cours, nous allons apprendre à créer notre propre feuille de style css et à la lier ensuite à la page HTML.
     
  • PDF on-line ZIP 
    fr
    Mettre en forme un texte en CSS
    par Pascale Lambert
    Il est très important de bien choisir le formatage des polices de caractères utilisées sur une page web pour avoir un bon rendu. Dans ce cours, nous allons apprendre à mettre en forme un texte grâce au CSS, ainsi que sont les pièges à éviter.
     
  • PDF on-line ZIP 
    fr
    Gérer les marges en CSS
    par Pascale Lambert
    Pour affecter des marges aux différents éléments d'une page web, les propriétés CSS à utiliser sont margin pour les marges extérieures, et padding pour les marges intérieures. À travers ce tutoriel, nous allons apprendre à gérer efficacement les marges de nos pages web avec du CSS.
     
  • PDF on-line ZIP 
    fr
    Les propriétés margin et padding ont bien été utilisées et pourtant le rendu visuel est différent selon les navigateurs. Dans ce tutoriel, nous allons apprendre à résoudre les problèmes de marges en CSS.
     
  • PDF on-line ZIP 
    fr
    À quoi servent les sélecteurs CSS class et id ? Tout simplement à définir des styles particuliers que l'on voudra reproduire de façon ponctuelle ou récurrente dans les pages (X)HTML. Ce cours a pour objectif de vous apprendre à utiliser ces sélecteurs et vous présentera leurs similitudes et leurs différences à travers deux exemples.
     
  • PDF on-line ZIP 
    fr
    Faire une mise en page avec deux ou trois colonnes peut se faire aisément sans tableaux. Ce tutoriel va vous apprendre à faire vos mises en page avec du CSS et présentera les atouts d'une mise en page full CSS par rapport à une mise en page par tableaux.
     
  • PDF on-line ZIP 
    fr
    Réalisez des bordures en CSS
    par Pascale Lambert
    Ce cours se charge de vous apprendre à faire des bordures en CSS. Avoir des bordures pour délimiter une zone, mettre en relief une information ou pour entourer les cellules d'un tableau est très répandu sur les pages web.
     
  • PDF on-line ZIP 
    fr
    Mettre une image de fond dans une page HTML est un exercice très répandu. Ce cours a pour objectif de vous apprendre toutes les possibilités qu'offrent les feuilles de style CSS.
     
  • PDF on-line ZIP 
    fr
    Pour tout effet de rollover (c'est-à-dire de changement d'aspect d'un élément au survol de la souris), la pseudo-classe CSS à utiliser est :hover. Ce tutoriel va vous apprendre à utiliser les différentes options parmi les plus recherchées de cette classe et quelques petites choses plus "exotiques" en matière de rollover.
     
  • PDF on-line ZIP 
    fr
    Pour positionner une image à droite ou à gauche d'un texte, on peut bien sûr utiliser une mise en forme par tableau. Mais un tableau n'est pas fait, normalement, pour faire de la mise en page. Ce cours a pour objectif de vous apprendre à partir du langage CSS, à aligner une image et du texte à la propriété CSS float qui fait "flotter" les éléments.
     
  • PDF on-line ZIP 
    fr
    Des listes à puces avec des images sont plus attrayantes que les styles donnés par défaut (disc, circle, square). Pour cela, inutile d'incorporer une image à chaque item dans le code (X)HTML. Il y a beaucoup plus simple ! Dans ce cours, nous allons apprendre à automatiser facilement la mise en image des listes à puces en CSS.
     
  • PDF on-line ZIP 
    fr
    A travers ce tutoriel, nous allons apprendre à réaliser correctement nos citations en CSS. Nombreux sont ceux qui utilisent la balise blockquote pour mettre un texte en retrait... Et bien non ! Elle n'est pas du tout faite pour cela."Quote" en anglais veut dire "citer". Cette balise doit donc être utilisée pour mettre en relief un "bloc" de citation.
     
  • PDF on-line ZIP 
    fr
    Le bouton élégant qui change d'aspect au passage de la souris est très utilisé sur les pages web. Longtemps, la majorité de ces boutons étaient animés par du JavaScript ou pire (car plus lourd) par une applet java. Le but de ce cours est de vous apprendre à concevoir vos boutons graphiques avec du CSS.
     
  • PDF on-line ZIP 
    fr
    Grâce à la propriété background-image, il est très facile de mettre une image de fond dans le corps (body) d'une page web. Mais on ne peut en mettre qu'une seule. Dans ce cours, nous allons apprendre à positionner plusieurs images aux quatre coins d'une page web.
     
  • PDF on-line ZIP 
    fr
    Ce tutoriel va vous apprendre deux méthodes pour appliquer un effet de zoom sur une image 100% en CSS : la première simplissime mais inopérante avec MSIE6, la seconde utilisant la technique des « portes coulissantes ».
     
  • PDF on-line ZIP 
    fr
    Zoomer une image avec le langage CSS est une chose facile. Dans ce tutoriel nous allons apprendre à créer une série de vignettes zoomables avec du CSS.
     
  • PDF on-line ZIP 
    fr
    Cours d'introduction aux standards du Web
    par Normand Lamoureux (traducteur)
    Ce tutoriel a pour but de vous apprendre les standards Web pour vos développement en (X)HTML et CSS. Les standards font du Web un lieu où les fichiers peuvent être lus par n'importe qui, peu importe le moyen par lequel il accède à Internet.
     
  • PDF on-line ZIP E-book 
    fr
    Dimensionner son texte avec rem
    par Sébastien Germez
    Le dimensionnement du texte sur une page Web est, encore aujourd'hui, un sujet épineux. La seule variable commune à tous les développeurs est l'utilisation de la propriété CSS font-size. Maintenant une question se pose : quelle unité utiliser avec cette propriété ? Dans ce tutoriel nous allons apprendre à utiliser une nouvelle unité introduite en CSS3: rem.
     
  • on-line 
    fr
    Ce tutoriel se charge de vous apprendre la compatibilité des propriétés CSS dans les emails au format HTML visualisés dans certains clients mails et webmails. Le résultat est assez surprenant.
     
  • PDF on-line ZIP 
    fr
    Nous parlons du Web 2.0 depuis si longtemps maintenant que nous savons désormais ce qu'il peut faire ou non. Nous allons apprendre dans ce cours trois techniques de base pour ajouter un peu de visualisation aux données, directement dans des structures de navigation basées sur les standards.
     
  • PDF on-line ZIP 
    fr
    Pour créer un site web il faut s'atteler à l'apprentissage de langages tels que le HTML et le CSS. Les CSS sont devenues aujourd'hui un maillon essentiel à la création de sites web. Elles permettent un large contrôle sur la présentation d'un document. Je vous propose une série de tutoriels pour vous apprendre le CSS, en suivant différentes étapes vous permettant de vous familiariser avec les feuilles de style.
     
  • PDF on-line ZIP 
    fr
    La syntaxe d'une règle CSS
    par Christophe F.
    Ce tutoriel a pour objectif de vous apprendre les bases du CSS : la syntaxe utilisée dans les feuilles de style. À travers ce cours, nous allons apprendre en particulier ce qu'est une règle CSS et à la décortiquer pour donner un aperçu de ses principales composantes. Nous verrons ensuite quelle est l'influence de la présentation du code CSS,puis nous aborderons les notions de regroupement des sélecteurs et de propriétés raccourcies.
     
  • on-line 
    fr
    Les feuilles de styles (CSS)
    par Hugo Étiévant
    Ce tutoriel vous propose une introduction aux feuilles de styles (ou CSS, Cascading Style Sheets) pour vous apprendre à créer des présentations surprenantes, des mises en pages très précises en modifiant les balises existantes, ou en créant de nouvelles dont les propriétés sont à votre choix.
     
menu Les mises en page
  • PDF on-line ZIP 
    fr
    Les cadres en CSS
    par Roger Johansson
    Ce tutoriel a pour objectif de vous apprendre une technique permettant de simuler, en apparence, un cadre HTML avec du CSS. La raison qui justifie la création d'une technique de cadres CSS est bien sûr la volonté d'abandonner l'utilisation des cadres HTML.
     
  • PDF on-line ZIP 
    fr
    Ce cours se charge de vous apprendre des méthodes pour centrer vos blocs à l'aide du CSS.
     
  • PDF on-line ZIP 
    fr
    La mise en page en utilisant des tableaux est fortement déconseillée. Mais comment faire autrement ? Ce tutoriel va vous apprendre pas à pas comment arriver aux mêmes résultats le plus simplement du monde.
     
  • PDF on-line ZIP E-book 
    fr
    L'objectif de ce cours est de nous apprendre à créer un gabarit utilisant le principe des « colonnes factices » en CSS. Il s'agit ici de définir deux ou plusieurs colonnes de la même hauteur avec des contenus à hauteur variable en simulant un tableau.
     
  • PDF on-line ZIP E-book 
    fr
    Dans ce cours, nous allons apprendre à créer une page de type FAQ qui soit jolie, pratique et faite uniquement en CSS3. Habituellement une page FAQ est une page longue, avec de nombreuses questions et réponses dans lesquelles il est difficile de trouver rapidement celle qui nous intéresse. Si vous possédez un site marchand par exemple, vous aurez besoin de ce genre de page.
     
  • PDF on-line ZIP E-book 
    fr
    Dans ce cours, nous allons apprendre à gérer le design de nos sites avec les grilles. Une grille a pour fonction de structurer un site Internet. Elle représente l'armature générale sur laquelle s'organise votre page Web et le positionnement de votre contenu est logiquement influencé par cette pratique favorisant ainsi sérieusement votre intégration CSS en la rendant plus rapide.
     
  • PDF on-line ZIP E-book 
    fr
    Dans ce cours nous allons apprendre les notions de base de l'approche Responsive Web Design avec les CSS.
     
menu Menus et barres de navigation
  • PDF on-line ZIP 
    fr
    Ce tutoriel a pour but de vous apprendre à créer, à partir d'une liste non numérotée, une barre de navigation.
     
  • PDF on-line ZIP 
    fr
    Ce tutoriel va vous apprendre comment se passer de JavaScript pour construire un menu déroulant, en utilisant uniquement des propriétés CSS sur un document XHTML.
     
  • PDF on-line ZIP 
    fr
    CSS Tabs, la navigation avec onglets
    par Loïc d'Anterroches
    Ce tutoriel propose une explication de deux méthodes pour obtenir une navigation par onglets, jolie et avec sémantiquement du sens, en mixant CSS et listes.
     
  • PDF on-line ZIP 
    fr
    Ce tutoriel va vous apprendre comment créer une barre de navigation telle que l'on voit souvent dans plusieurs Digg-like telles Digg.com.
     
  • PDF on-line ZIP 
    fr
    Un des plus grands défis d'un concepteur web est de trouver un moyen de placer beaucoup d'informations sans perdre de lisibilité. Les onglets sont un bon moyen de gérer ce type de problème. Depuis l'avènement du Web 2.0, on voit une quantité phénoménale de blogs utilisant cette technique. Dans ce tutoriel, nous allons donc apprendre à créer une boîte d'onglets en HTML et en y ajoutant des fonctionnalités à l'aide de CSS, JavaScript et jQuery.
     
  • PDF on-line ZIP 
    fr
    Ce tutoriel va vous apprendre différentes techniques CSS pour réaliser des paginations ayant du style.
     
  • PDF on-line ZIP E-book 
    fr
    Ce cours a pour objectif de vous apprendre à rendre la navigation de vos utilisateurs plus facile en créant un menu fixe toujours visible. Mais pour que ce menu ne gène pas le contenu de chaque page, on masquera la moitié des images utilisées pour le menu. Les images ne s'afficheront entières qu'au survol de la souris.
     
  • PDF on-line ZIP E-book 
    fr
    Les fonctionnalités CSS3 telles que les transitions, les animations et les transformations permettent d'ajouter du piquant à vos pages Web. Dans ce tutoriel nous allons apprendre à utiliser ces fonctionnalités pour créer un menu déroulant animé.
     
  • PDF on-line ZIP E-book 
    fr
    Un menu déroulant en CSS3
    par Catalin Rosu
    Dans ce tutoriel vous allez apprendre à créer un menu déroulant en CSS3 sans code JavaScript additionnel. Il utilise un balisage HTML minimal mais aucune image.
     
  • PDF on-line ZIP E-book 
    fr
    Céer un menu animé en CSS
    par Paul Underwood
    Le but de ce tutoriel est de vous apprendre à créer un menu animé en utilisant les transitions CSS.
     
menu Les meilleures astuces
  • PDF on-line ZIP 
    fr
    Ce tutoriel a pour but de vous apprendre une technique pour créer une barre de progression animée en n'utilisant que du code CSS.
     
  • PDF on-line ZIP 
    fr
    Ce tutoriel va vous apprendre deux méthodes distinctes pour réaliser un système de préchargement d'images en utilisant uniquement du CSS.
     
  • PDF on-line ZIP 
    fr
    Ce cours a pour objectif de vous apprendre comment personnaliser vos boutons avec des images et uniquement du CSS.
     
  • PDF on-line ZIP 
    fr
    Ce cours se charge de vous apprendre des méthodes pour centrer vos blocs à l'aide du CSS.
     
  • PDF on-line ZIP 
    fr
    Ce tutoriel a pour objectif de vous apprendre les bases des CSS à travers différents trucs et astuces.
     
  • PDF on-line ZIP 
    fr
    A travers ce tutoriel nous allons apprendre la méthode pour remplacer les puces par défaut des listes ul li par des images.
     
  • PDF on-line ZIP 
    fr
    Une technique émerge de plus en plus du net : la création d'une liste ayant un contenu plus que conséquent, survolable en utilisant des balises a. Ce tutoriel aura donc pour unique but de vous la présenter et de vous apprendre à l'implémenter.
     
  • PDF on-line ZIP 
    fr
    Ce tutoriel va vous apprendre à contrôler la taille des vignettes qui figurent sur votre site web. Il nous arrive parfois de ne pas avoir suffisamment d'espace pour intégrer des vignettes de grande taille et pourtant on souhaite éviter les petites images à peine reconnaissables. En utilisant cette astuce on peut modifier les dimensions de base de la vignette pour l'afficher en grand au survol de la souris.
     
  • PDF on-line ZIP 
    fr
    Dégradé de texte CSS
    par CSS Globe
    Dans ce tutoriel nous allons apprendre les bienfaits de l'utilisation des titres (X)HTML (h1, h2, etc.) pour vos divers documents.
     
  • PDF on-line ZIP 
    fr
    Les feuilles de style CSS sont très pratiques pour séparer le fond et la forme mais il leur manque la possibilité de déclarer des variables que l'on pourrait réutiliser tout au long d'un projet web. Heureusement pour nous, PHP est là et dans ce tutoriel, nous allons apprendre à l'utiliser pour dynamiser nos CSS.
     
  • PDF on-line ZIP 
    fr
    Ce tutoriel va vous apprendre à mettre en place facilement des curseurs de réglage de type "Facebook" en utilisant les technologies JavaScript (Mootools) et les feuilles de style.
     
  • PDF on-line ZIP 
    fr
    Ce tutoriel va vous apprendre à positionner en CSS un élément de manière fixe, aussi bien sur Firefox ou les autres navigateurs alternatifs que sur Internet Explorer 6 et 7.
     
  • PDF on-line ZIP 
    fr
    Réalisez un histogramme avec CSS
    par CSS Globe, Alban Lelasseux (traducteur)
    La visualisation de données est réalisée le plus souvent par des applications flash ou avec l'aide de certains langages de programmation. A travers ce cours, nous allons apprendre à réaliser un histogramme avec du CSS.
     
  • PDF on-line ZIP 
    fr
    Effet d'accordéon avec CSS et JavaScript
    par Rob Glazebrook, Joris Crozier
    Ce tutoriel a pour but de vous apprendre une technique permettant de créer un effet d'accordéon avec du CSS et du JavaScript.
     
  • PDF on-line ZIP 
    fr
    Créer des coins arrondis à l'aide de Sprites CSS
    par Ignacio Ricci, Christophe F.
    À travers ce tutoriel, nous allons apprendre une méthode pour réaliser des coins arrondis en CSS. Il est important de signaler que ce cours présente une méthode avancée en ce qui concerne les CSS mais je vais essayer de la rendre aussi simple que possible pour ceux qui débutent en CSS.
     
  • PDF on-line ZIP 
    fr
    Optimisez le chargement des images de votre site avec les Sprites CSS
    par CSS Globe, Alban Lelasseux (traducteur)
    Ce tutoriel va vous apprendre une méthode permettant d'améliorer le temps de chargement des images de votre site web : les Sprites CSS.
     
  • PDF on-line ZIP 
    fr
    Pour réaliser des blocs (menus ou autres) avec des coins arrondis, il existe principalement trois méthodes en CSS qui offrent plus ou moins de fluidité et de possibilités graphiques. Ce cours a pour but de vous apprendre à créer des coins arrondis en CSS pour vos blocs (X)HTML.
     
  • PDF on-line ZIP 
    fr
    Ce cours a pour objectif de vous apprendre à créer des tableaux à bordures fines. Avec une petite dose de CSS, border les cellules d'un tableau d'un élégant trait fin devient un jeu d'enfant.
     
  • PDF on-line ZIP E-book 
    fr
    Dans ce tutoriel nous allons apprendre à utiliser Fake Images Please pour générer des images types pour nos pages Web. Ce service vous permet de créer des images types de la taille que vous souhaitez en utilisant son API, ce qui signifie que vous pouvez simplement utiliser ces images en les insérant en HTML.
     
  • PDF on-line ZIP E-book 
    fr
    Une image Polaroid est une icône représentant une image. Dans ce tutoriel, nous allons nous intéresser aux images Polaroid et apprendre à en créer une galerie uniquement grâce aux CSS.
     
  • PDF on-line ZIP E-book 
    fr
    Dans ce tutoriel nous allons apprendre une petite astuce pour modifier la taille des éléments HTML en CSS. Il y a plusieurs choses qui définissent la taille d'un élément comme sa largeur, les marges intérieures ou encore les bordures.
     
  • PDF on-line ZIP E-book 
    fr
    Dans ce cours nous allons apprendre à créer un bouton de partage de contenu original pour les principaux réseaux sociaux.
     
  • PDF on-line ZIP E-book 
    fr
    Les infobulles peuvent jouer un rôle important dans l'ergonomie de votre site, ceci n'est nouveau pour personne. Il faut juste les utiliser correctement pour améliorer l'expérience utilisateur de vos visiteurs. À travers ce cours, nous allons voir apprendre à les utiliser sur une image avec des zones réactives comprenant des repères et des infobulles.
     
  • PDF on-line ZIP E-book 
    fr
    L'édition de contenu en ligne n'est pas nouveau et est même déjà proposé par plusieurs CMS. Cela permet notamment à l'utilisateur de se rendre compte en direct des modifications qu'il apporte à sa page. Il existe aujourd'hui un meilleur moyen de faire cela, avec une propriété CSS3. Nous allons apprendre dans ce tutoriel à utiliser la propriété -user-modif pour autoriser l'utilisateur à modifier le contenu en ligne.
     
  • PDF on-line ZIP E-book 
    fr
    Il existe une technique bien connue qui relève plus de l'astuce pour masquer du texte en CSS : utiliser la propriété text-indent et lui assigner la valeur -9999px. Cette technique fonctionne bien mais présente un inconvénient au niveau des performances car le navigateur va automatiquement créer une zone géante de 9999 pixels en dehors de l'écran. Nous allons apprendre dans ce tutoriel une technique alternative qui résout ce problème.
     
  • PDF on-line ZIP E-book 
    fr
    Dans ce tutoriel nous allons apprendre à créer des animations visuelles attrayantes en CSS pour les utilisateurs grâce au projet Animate.css. Nous allons nous intéresser à plusieurs des plus populaires de ces animations parmi les 53 que le projet propose et ainsi proposer le code CSS correspondant à ces animations.
     
  • PDF on-line ZIP E-book 
    fr
    Dans ce tutoriel nous allons apprendre à utiliser le CSS3 pour donner un effet de brillance à des boutons. Pour ce faire nous allons utiliser les propriétés box-shadow, border-radius et animation. L'effet de brillance s'activera lorsque l'utilisateur survolera le bouton avec le pointeur de sa souris.
     
  • PDF on-line ZIP E-book 
    fr
    Le but de ce tutoriel est de nous apprendre à utiliser les transitions CSS3 pour donner un effet 3D à un bouton lorsque l'on clique dessus. Pour ce faire nous allons utiliser la propriété box-shadow qui aura tout d'abord une valeur élevée, puis à la suite d'un clic sur le bouton par un visiteur nous changerons la valeur pour une plus faible ce qui donnera l'impression que le bouton a été pressé vers le bas.
     
  • PDF on-line ZIP E-book 
    fr
    En tant que développeur Web, on est rarement à l'aise avec les images et si l'on peut éviter de les utiliser on le fait. C'est pourquoi nous allons apprendre dans ce cours, la création de boutons avec des icônes sans utiliser d'images pour générer ces icônes avec du CSS.
     
  • PDF on-line ZIP E-book 
    fr
    J'ai appris à utiliser les ombres portées et internes avec Photoshop. Mais désormais avec CSS3 vous n'avez plus besoin de Photoshop pour ajouter ces ombrages à vos boîtes. Dans ce cours, nous allons apprendre à créer des effets étonnants avec la propriété CSS3 box-shadow
     
  • PDF on-line ZIP E-book 
    fr
    Des infobulles en CSS3
    par Catalin Rosu
    Ce cours va vous apprendre à créer vos propres infobulles uniquement en CSS3 : sans image et sans JavaScript.
     
  • PDF on-line ZIP E-book 
    fr
    Ce cours pour objectif de vous apprendre à créer une galerie d'images avec un effet de zoom. Nous allons aussi ajouter un bouton de fermeture pour réduire l'image zoomée. Le mieux, c'est que nous allons faire tout cela uniquement en CSS !
     
  • PDF on-line ZIP E-book 
    fr
    Ce tutoriel a pour objectif de vous apprendre à créer des animations de chargement avec CSS 3.
     
  • PDF on-line ZIP E-book 
    fr
    En jouant à DIRT 3, j'ai remarqué que l'interface utilisateur utilisait un triangle animé qui m'a beaucoup plu. Je me suis tout de suite demandé comment réaliser une version similaire en CSS3. Dans ce tutoriel je vais donc vous apprendre à créer une animation de chargement expérimentale en CSS3.
     
  • PDF on-line ZIP E-book 
    fr
    Dans ce tutoriel je voudrais vous apprendre comment créer un bouton d'abonnement en CSS3 pour votre blog (RSS, Twitter, FB...).
     
  • PDF on-line ZIP E-book 
    fr
    Un sprite CSS est une technique employée par un grand nombre de webdesigners consistant à réunir plusieurs images en une seule. Cela a pour conséquence de réduire significativement la charge de travail de votre navigateur et d'augmenter ainsi la vitesse de chargement de votre site Internet. Dans ce cours, vous allez apprendre à réduire vos requêtes HTTP avec les Sprites CSS
     
  • PDF on-line ZIP E-book 
    fr
    Comment centrer un élément (par exemple une barre de navigation) ne contenant que des éléments flottants ? Comme nous le savons tous, centrer ce type de contenu peut parfois devenir compliqué et piégeux. Dans ce tutoriel, nous allons apprendre des solutions pour parvenir à centrer le menu avec la propriété CSS fit-content.
     
  • PDF on-line ZIP E-book 
    fr
    Dans ce tutoriel, nous allons apprendre à créer des sphères en CSS3.
     
  • PDF on-line ZIP E-book 
    fr
    Même si le JavaScript a encore de beaux jours devant lui en matière d'animation, on peut tout à fait concevoir une galerie fonctionnant au clic de la souris en CSS3. Ce cours a pour objectif de vous apprendre à réaliser une galerie en utilisant entre autres la pseudoclasse :checked introduite avec la norme CSS3 et ce sans JavaScript.
     
  • PDF on-line ZIP E-book 
    fr
    À travers ce tutoriel, nous allons apprendre étape par étape deux méthodologies notamment OOCSS (Object Oriented CSS) et BEM(Block, Element, Modifier) pour mieux organiser nos pages CSS.
     
menu Personnalisation d'éléments (X)HTML
  • PDF on-line ZIP 
    fr
    Ce cours a pour objectif de vous apprendre des méthodes de mise en forme des titres (X)HTML et vous montre comment les utiliser dans l'organisation de votre document.
     
  • PDF on-line ZIP 
    fr
    Les boîtes de message sont des éléments des plus utiles de nos jours dans toute application web. Ce cours a pour but de vous apprendre à intégrer dans vos sites, des boîtes de message stylisées avec CSS.
     
  • PDF on-line ZIP 
    fr
    Ce tutoriel a pour objectif de vous apprendre des techniques pour rendre visibles vos liens externes depuis votre site.
     
  • PDF on-line ZIP 
    fr
    Ce tutoriel se charge de vous apprendre à mettre en forme un formulaire avec du CSS sans oublier les balises label, fieldset et optgroup.
     
  • PDF on-line ZIP 
    fr
    N'aviez-vous jamais rêvé de personnaliser intégralement vos formulaires (X)HTML, du simple champ texte en passant par les boutons radio, les listes déroulantes et même les champs file ? Ce tutoriel va vous apprendre une des nombreuses (pas si nombreuses) méthodes pour réaliser ce tour de force.
     
  • PDF on-line ZIP 
    fr
    Les tableaux (XHTML & CSS)
    par Adrien Pellegrini
    Les tableaux ont été introduits pour pouvoir afficher des données tabulaires. Il n'est plus question d'utiliser des tableaux pour la mise en page d'un site. Nous allons apprendre dans ce tutoriel les balises se rapportant aux tableaux et comment rendre son tableau plus beau avec du CSS. Une attention particulière sera portée sur l'accessibilité.
     
  • PDF on-line ZIP 
    fr
    Personnalisez vos boîtes de message (X)HTML
    par Janko Jovanovic, Didier Mouronval
    Dans ce tutoriel, nous allons apprendre à faire des boîtes de message personnalisées en fonction du type de message.
     
  • PDF on-line ZIP 
    fr
    Créer une galerie d'images avec :target
    par Peter Gasston, Julien Itard
    Ce cours a pour objectif de vous apprendre à utiliser :target, l'un des nouveaux sélecteurs du CSS3, pour appliquer des règles à un élément ayant un identifiant spécifique, que ce soit une ancre ou un id.
     
  • PDF on-line ZIP 
    fr
    Pour réaliser des blocs (menus ou autres) avec des coins arrondis, il existe principalement trois méthodes en CSS qui offrent plus ou moins de fluidité et de possibilités graphiques. Ce cours a pour but de vous apprendre à créer des coins arrondis en CSS pour vos blocs (X)HTML.
     
  • PDF on-line ZIP E-book 
    fr
    Qui n'a pas rêvé un jour de mettre sa police sur son site Web ? Et bien maintenant cela est possible avec CSS3 et la propriété @font-face. Le but de ce tutoriel est de vous apprendre à mettre des polices personnalisées sur vos sites.
     
  • PDF on-line ZIP E-book 
    fr
    Avec l'HTML 5 viennent de nouveaux moyens de valider vos formulaires sans être obligé d'utiliser du JavaScript. Un de ces moyens est l'attribut required qui vous permet de préciser quels éléments d'un formulaire sont obligatoires avant validation. Dans ce tutoriel, nous allons apprendre à utiliser la pseudoclasse :invalid pour changer le style d'éléments de formulaire invalides.
     
  • PDF on-line ZIP E-book 
    fr
    Chaque navigateur possède ses propres styles par défaut. Pour pouvoir manipuler ces styles par défaut, il faut utiliser la propriété CSS3 -appearance. Dans ce cours, nous allons apprendre à changer l'apparence d'un élément HTML en CSS3 en utilisant les styles par défaut des navigateurs.
     
  • PDF on-line ZIP E-book 
    fr
    Ajouter des styles à des listes ordonnées a longtemps été une tâche difficile et piégeuse. Pour donner un style aux nombres, vous devez d'abord supprimer le style par défaut du navigateur puis ajuster le code des éléments de la liste afin de leur donner le style approprié. Dans ce tutoriel, je vais vous apprendre à utiliser CSS3 pour améliorer la présentation de vos listes ordonnées en utilisant une approche sémantique.
     
  • PDF on-line ZIP E-book 
    fr
    Dans ce tutoriel nous allons apprendre à réaliser un lecteur vidéo personnalisé étape par étape. Le Web d'aujourd'hui est devenu largement multimédia et une large part de la conception de sites consiste maintenant à inclure des vidéos. Personnaliser un lecteur vidéo devient une des préoccupations principales des créateurs Web lorsqu'ils intègrent ces éléments car le plus souvent le lecteur par défaut ne correspond pas à la charte graphique du site, mais aussi pour des questions de support des navigateurs et des différents appareils.
     
  • PDF on-line ZIP E-book 
    fr
    Dans ce tutoriel nous allons apprendre à styliser des checkbox HTML afin de les adapter au style très en vogue sur le Web en ce moment : le « flat design ».
     
Consultez tous les cours

Copyright © 2007-2017 Developpez.com Developpez LLC. Tous droits réservés Developpez LLC. Aucune reproduction, même partielle, ne peut être faite de ce site ni de l'ensemble de son contenu : textes, documents et images sans l'autorisation expresse de Developpez LLC. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts.