Comment retirer la flèche d'un dropdown select sur webflow ?

Tutoriel
3 min
Publié le Nov 21, 2022
Dernière mise à jour le
Custom code pour cacher l'icône d'un select field webflow
Résumez cet article avec une IA
Points clés de l'article

Par défaut, lorsque vous intégrez un champ select field dans un formulaire webflow, vous avez une icône ↓ (flèche vers le bas), que "vous ne pouvez pas" supprimer.

Sauf.... si vous intégrez un petit bout de custom code 😉

Découvre dans ce tutoriel comment cacher cette icône par défaut, afin de pouvoir ajouter ton icône de dropdown 100% personnalisable.

Custom code pour cacher l'icône par défaut d'un select field webflow

  1. Ajouter un élément HTML embed code editor
  2. Intégrer le custom code css ci-dessous dedans
<style>
.w-select {    
  -webkit-appearance: none;    
  -moz-appearance: none;
}
</style>
select field webflow avec icône arrow bottom
L'icône ↓ est encore présente
Custom code pour cacher l'icône de flèche dans un select field
L'icône ↓ n'est plus présente

Et voilà ! L'icône par défaut est maintenant caché ✅

Il vous est maintenant possible d'ajouter une flèche personnalisée, créée "from scratch" depuis l'interface designer de webflow.

Florian Bodelot
Florian Bodelot
Co-fondateur

Articles qui devraient vous intéresser

Résultat du score Agent Readiness pour Digidop affichant un score de 100 et un niveau agent native
Tutoriel
IA

Votre site est-il prêt pour les agents IA ?

Votre site est-il prêt pour les agents IA ?
Interface de génération de code AI avec des icônes d'outils et un exemple d'extrait de code animé
Documentation
IA

Créer avec l’IA : pourquoi cette révolution ne va pas ralentir

Créer avec l’IA : pourquoi cette révolution ne va pas ralentir
Grille minimaliste de six logos de CMS headless (Sanity, Contentful, Storyblok, Prismic, Strapi, ButterCMS) affichés sur des cartes arrondies avec ombres douces, sur un fond en dégradé pastel.
Documentation
Développement

Notre sélection des meilleurs CMS headless en 2026

Notre sélection des meilleurs CMS headless en 2026

Transformez votre site web en un moteur de croissance.

Nous contacter