Procesul de creare a butonului va începe cu marcajul HTML. Ca o imagine vom folosi o pictogramă în format de font (Glyphicon Halflings, Font Awesome sau altele).
Atenție: Fonturile de font și stilurile CSS trebuie să fie conectate la pagină.
După crearea marcajului, vom scrie stilurile CSS care vor plasa butonul nostru în locul potrivit, vom seta aspectul pentru acesta și vom schimba culoarea de fundal atunci când vom trece peste cursor.
Buton pentru derularea paginii
- Indiferent dacă se afișează butonul sau nu, în funcție de faptul dacă utilizatorul a derulat pagina cu mai mult de 200 de pixeli în jos de la marginea superioară sau nu;
- când faceți clic pe buton, parcurgeți pagina cu animația.
În exemplul de mai sus, pictograma fa-chevron-up a fost utilizată din fontul Font Awesome. În plus față de această pictogramă, puteți utiliza orice altă pictogramă din acest font sau din orice altă pictogramă.
Exemple de butoane pentru derularea paginii
Modificați culoarea butonului în sus
Dacă este necesar, puteți ajusta culoarea, dimensiunea, locația și mulți alți parametri ai butonului, modificând setările regulilor CSS de mai sus. De exemplu, schimbând culoarea culorii de fundal, puteți obține următoarele butoane:
Modificați culoarea butonului folosind culoarea de fundal a proprietății CSS