Βήμα 1:Δημιουργία προσαρμοσμένου CSS
ένα. Στο πρόγραμμα επεξεργασίας Weebly, κάντε κλικ στις "Ρυθμίσεις" στην επάνω δεξιά γωνία.
σι. Επιλέξτε "SEO &Code" από το αριστερό μενού.
ντο. Κάντε κλικ στην καρτέλα "Προσαρμοσμένο CSS".
ρε. Επικολλήστε τον ακόλουθο κώδικα στο πεδίο Προσαρμοσμένο CSS:
```
.btn {
οθόνη:inline-block;
padding:15px 25px;
μέγεθος γραμματοσειράς:16 px;
text-align:κέντρο;
κείμενο-διακόσμηση:κανένα;
χρώμα:#fff;
φόντο:#3498db;
σύνορο:κανένα;
δρομέας:δείκτης;
}
.btn:hover,
.btn:active {
φόντο:#2980b9;
}
.btn:active {
transform:scale(0,95);
}
```
Βήμα 2:Προσθήκη στοιχείου HTML για το κουμπί
ένα. Στο πρόγραμμα επεξεργασίας Weebly, σύρετε και αποθέστε ένα στοιχείο "Ενσωμάτωση κώδικα" στη σελίδα σας όπου θέλετε να εμφανίζεται το κουμπί.
σι. Επικολλήστε τον ακόλουθο κώδικα HTML στο πεδίο "Code":
```
```
Βήμα 3:Προσαρμόστε το κουμπί
Μπορείτε να προσαρμόσετε το κουμπί τροποποιώντας τις ακόλουθες ιδιότητες στον κώδικα CSS:
ένα. `.btn {color:#fff; φόντο:#3498db;}` - Αλλάξτε το χρώμα κειμένου και το χρώμα φόντου του κουμπιού.
σι. `.btn:hover, .btn:active { background:#2980b9;}` - Αλλάξτε το χρώμα αιώρησης και ενεργής κατάστασης του κουμπιού.
Βήμα 4:Προεπισκόπηση και δημοσίευση
ένα. Κάντε κλικ στο κουμπί "Προεπισκόπηση" για να δείτε πώς φαίνεται το κουμπί στον ιστότοπό σας.
σι. Εάν είστε ικανοποιημένοι με τα αποτελέσματα, κάντε κλικ στο "Δημοσίευση" για να πραγματοποιήσετε τις αλλαγές ζωντανά στον ιστότοπό σας.
Σημείωση :Ο παρεχόμενος κώδικας CSS χρησιμοποιεί το κείμενο του κουμπιού "Κάντε κλικ σε εμένα". Μπορείτε να το αντικαταστήσετε με το επιθυμητό κείμενο εντός του κώδικα HTML.
Ακολουθώντας αυτά τα βήματα, μπορείτε να προσθέσετε κουμπιά 3D CSS στον ιστότοπό σας Weebly για να βελτιώσετε την εμπειρία χρήστη και την οπτική του ελκυστικότητα.
Πνευματικά δικαιώματα © Γνώση Υπολογιστών Όλα τα δικαιώματα κατοχυρωμένα