#11 Copier le code CSS d’un élément Webflow‍

Saviez-vous que vous pouvez copier les propriétés CSS de n’importe quel élément de votre projet Webflow ?

Eh oui, c’est désormais possible depuis le Designer de Webflow de venir sélectionner un élément (qui a une classe) et copier le code CSS des styles que nous avons appliqués sur sa classe.

Cela peut être utile si vous codez un peu et que vous souhaitez par exemple modifier une valeur CSS sur un type d’écran précis ou pour tout un tas d’autres cas d’application possible.

Pour ce faire, il vous suffit de :

1. Cliquer sur la dernière icône dans la partie gauche du Designer pour ouvrir le menu « Help » (icône avec un point d’interrogation)
2. Dans le menu « Help », cliquer sur « CSS Preview »
3. Sélectionner un élément sur votre page et dans l’encart « CSS Preview » venir cliquer sur « Copy to clipboard »

Dans l’encart, vous pouvez déjà voir le code CSS que vous allez copier.

Cette fonctionnalité est en version Beta, il peut donc y avoir des « bugs » lors de la copie du code. De plus, vous ne pouvez pas récupérer les propriétés de base appliquées aux éléments lors du design des balises sémantiques HTML (Headings, Paragraph, Images, Block Quotes, etc.). Malgré tout, vous pouvez récupérer les styles appliqués selon les différents statuts des éléments (Hover, Pressed, Focused, etc.).

‍