Liens en tant que boutons en CSS

apcpedagogie > Les cours de programmation > CSS > Liens en tant que boutons en CSS

Liens en tant que boutons en CSS

  • 26 novembre 2018
  • Posté par: Riadh HAJJI
  • Catégorie: CSS
1 036 vues


Liens en tant que boutons en CSS

  1. Objectif

    • Etre capable de changer un lien en un bouton à l’aide du langage HTML et du CSS.



  2. Introduction

    • Comme d’autres éléments HTML, CSS peut ajouter des couleurs d’arrière-plan et un remplissage aux liens nous permettant de créer l’apparence d’un bouton.
    • Avec la Création du bouton lien en CSS on conserve la même mise en forme de bouton pour des liens simples indépendants des formulaires.
    • Pour ces types de boutons liens, la structure change. On utilise la balise <a> en remplacement de la balise button :

  3. Donner l’apparence d’un lien à un bouton

    • Comme d’autres éléments HTML, CSS peut ajouter des couleurs d’arrière-plan et un remplissage aux liens nous permettant de créer l’apparence d’un bouton.

      • Exemples

      1. Un premier bouton très simple, qui change de couleur au passage de la souris
        • Code CSS:

        • Code HTML:
        • Résultat:
      2. Un deuxième bouton , avec des bordures arrondis
        • Code CSS:

        • Code HTML:
        • Résultat:
      3. Un troisième bouton, qui change donne un effet de transition lors du passage de la souris
        • Code CSS:

        • Code HTML:
        • Résultat:

Sommaire du cours CSS


Abonnez vous à notre chaîne YouTube gratuitement