|
Ajout de boutons-pression CSS 3D dans Weebly implique quelques étapes de personnalisation du code dans la section CSS personnalisée. Voici comment vous pouvez les ajouter à votre site Weebly :
Étape 1 :Créer un CSS personnalisé
un. Dans l'éditeur Weebly, cliquez sur « Paramètres » dans le coin supérieur droit.
b. Sélectionnez « SEO &Code » dans le menu de gauche.
c. Cliquez sur l'onglet "CSS personnalisé".
d. Collez le code suivant dans le champ CSS personnalisé :
```
.btn {
affichage :bloc en ligne ;
remplissage :15px 25px;
taille de police :16 px ;
alignement du texte :centre ;
décoration de texte :aucune ;
couleur :#fff ;
arrière-plan :#3498db ;
bordure :aucune ;
curseur :pointeur;
}
.btn :survoler,
.btn:actif {
arrière-plan : #2980b9 ;
}
.btn:actif {
transformation :échelle (0,95);
}
```
Étape 2 :Ajouter un élément HTML pour le bouton
un. Dans l'éditeur Weebly, faites glisser et déposez un élément « Intégrer le code » sur votre page à l'endroit où vous souhaitez que le bouton apparaisse.
b. Collez le code HTML suivant dans le champ "Code" :
```
Cliquez sur moi
```
Étape 3 :Personnaliser le bouton
Vous pouvez personnaliser le bouton en modifiant les propriétés suivantes dans le code CSS :
un. `.btn {couleur :#fff ; background:#3498db;}` - Change la couleur du texte et la couleur d'arrière-plan du bouton.
b. `.btn:hover, .btn:active { background:#2980b9;}` - Modifiez la couleur du survol et de l'état actif du bouton.
Étape 4 :Prévisualiser et publier
un. Cliquez sur le bouton "Aperçu" pour voir à quoi ressemble le bouton sur votre site.
b. Si vous êtes satisfait des résultats, cliquez sur « Publier » pour appliquer les modifications en direct sur votre site Web.
Remarque :Le code CSS fourni utilise le texte du bouton "Cliquez sur moi". Vous pouvez le remplacer par le texte de votre choix dans le code HTML.
En suivant ces étapes, vous pouvez ajouter des boutons-pression CSS 3D à votre site Weebly pour améliorer son expérience utilisateur et son attrait visuel.
|
