Jak mogę stworzyć efekty CSS Hover?
Efekty aktywowania CSS są dość łatwe do utworzenia, a podstawowe efekty aktywowania można szybko i łatwo wdrożyć i zmodyfikować za pomocą szeregu innych opcji. Kaskadowe arkusze stylów (CSS) to język używany do tworzenia stylu i układu dokumentu utworzonego w języku znaczników, i można go łatwo używać do tworzenia efektów najechania kursorem. Efekty najechania to zmiany, które występują w tekście, obrazach lub innych obiektach w dokumencie, gdy kursor sterowany myszką jest najechany na obiekt. Efekty najechania CSS są zwykle tworzone w kodzie CSS i można je szybko i skutecznie zaimplementować.
Jednym z najłatwiejszych do utworzenia efektów najechania kursorem CSS jest efekt, który powoduje zmianę łącza w witrynie po najechaniu kursorem. Na przykład ktoś może chcieć utworzyć link tekstowy, który wygląda jak standardowy tekst lub ma inny kolor niż reszta strony, ale gdy „przesuwa się” lub „najeżdża kursorem”, jest podkreślony lub pogrubiony. To, jak zostanie to zrobione, będzie zazwyczaj zależeć od dokładnego kodowania zastosowanego na stronie, ale w prostym przypadku efekt najechania CSS można dodać w ramach reguł CSS w sekcji „styl”.
Nowa reguła jest tworzona dla efektu najechania CSS przy użyciu odpowiedniego znacznika dla obiektu, do którego dodawany jest efekt. Na przykład wybrany tekst może być częścią listy lub zaznaczony w treści strony. Ten tekst powinien mieć przypisany określony znacznik w kodzie ciała. Po zaznaczeniu tego znacznika można utworzyć regułę, aby ustalić efekt najechania CSS dla dowolnych obiektów z tym znacznikiem.
Na przykład używając tekstu, jeśli chcesz, aby link stał się podkreślony, gdy użytkownik najedzie na niego kursorem, możesz zacząć od oznaczenia tego linku w kodzie i utworzenia specjalnej reguły dla tego tagu. W ramach tej reguły możesz wskazać, jaki kolor powinien mieć ten tekst, łatwo wyróżniając go od otaczającego tekstu, i wizualnie wskazując, że użytkownik może chcieć najechać na niego kursorem, co spowoduje wyzwolenie efektu najechania CSS. Ten efekt jest dodawany przez utworzenie „znacznika pseudo-klasy” w znaczniku dla wiersza tekstu.
Jeśli na przykład znacznikiem tekstu byłby „a”, wówczas użyłbyś pseudoklasy, która wyglądała jak „a: hover {…}” z pożądanym efektem najechania CSS wskazanym w nawiasie. Korzystając z poprzedniego przykładu, jeśli pożądanym efektem byłoby podkreślenie tekstu po najechaniu myszką, to czytałby on „dekoracja tekstu: podkreślenie;” w nawiasie. Istnieje wiele różnych efektów aktywowania, które można utworzyć dla różnych obiektów, a każdy z nich ma określone polecenie do utworzenia efektu, ale w większości przypadków proces jest podobny.