(Opcjonalnie) Zaznacz element (akapit, nagłówek itp.), do którego chcesz zastosować efekt przejścia. Można również utworzyć przejście, a dopiero później zastosować je do elementu.
Ostatnia aktualizacja
25 kwi 2024
Panel Przejścia CSS umożliwia tworzenie, modyfikowanie i usuwanie efektów przejścia CSS3.
Aby utworzyć efekt przejścia CSS3, należy zdefiniować klasę przejścia. Robi się to, przypisując odpowiednie wartości tym właściwościom elementu, które sterują przejściem. Jeśli przed przystąpieniem do tworzenia klasy przejścia był już zaznaczony element, to klasa przejścia zostanie automatycznie zastosowana do tego elementu.
Można wybrać dodanie wygenerowanego kodu CSS do bieżącego dokumentu lub określić zewnętrzny plik CSS.
Tworzenie i stosowanie efektu przejścia CSS3
Wybierz Okno > Przejścia CSS.
Kliknij ikonę 
.
Utwórz klasę przejścia, korzystając z opcji w oknie dialogowym Nowe przejście.
Reguła docelowa
Wpisz nazwę selektora. Selektorem może być dowolny selektor CSS, np. znacznik, reguła, identyfikator lub selektor złożony. Na przykład aby zastosować efekty przejścia do wszystkich znaczników <hr>, wpisz selektor hr
Przejście podczas
Wybierz stan, do którego chcesz zastosować przejście. Na przykład aby efekt przejścia był stosowany wtedy, gdy kursor myszy przesuwa się nad element, należy użyć opcji hover.
Użyj tego samego efektu przejścia dla wszystkich właściwości
Wybierz tę opcję, jeśli chcesz określić ten sam Czas trwania, Opóźnienie i Funkcja czasu dla wszystkich właściwości CSS, które chcesz przejść.
Użyj innego efektu przejścia dla każdej właściwości
Wybranie tej opcji umożliwia podawanie osobnych wartości parametrów Czas trwania, Pauza i Funkcja regulacji czasu dla poszczególnych właściwości CSS, które mają podlegać przejściu.
Właściwość
Kliknij ikonę , aby dodać właściwość CSS do efektu przejścia.
Czas trwania
Wprowadź czas trwania efektu przejścia w sekundach (s) lub milisekundach (ms).
Pauza
Określa czas oczekiwania (w sekundach lub milisekundach) na rozpoczęcie efektu przejścia.
Funkcja regulacji czasu
Wybierz styl przejścia spośród dostępnych opcji.
Wartość końcowa
Końcowa wartość efektu przejścia. Aby na przykład po zakończeniu efektu przejścia rozmiar czcionki zwiększył się do 40 pikseli, należy podać wartość 40 px dla właściwości „font-size”.
Wybierz położenie przejścia
Aby osadzić styl w bieżącym dokumencie, wybierz opcję Tylko ten dokument.
Jeśli chcesz utworzyć zewnętrzny arkusz stylów dla kodu CSS3, wybierz opcję Nowy plik z arkuszem stylów. Po kliknięciu opcji Utwórz przejście program poprosi o określenie miejsca, w którym ma zostać zapisany nowy plik CSS. Nowo utworzony arkusz stylów jest dodawany do menu Wybierz położenie przejścia.
Edytowanie efektów przejścia CSS3
W panelu Przejścia CSS wybierz efekt przejścia, który chcesz edytować.
Kliknij ikonę 
.
Posługując się oknem dialogowym Edytuj przejście, zmodyfikuj wprowadzone wcześniej wartości przejścia.
Wyłączanie notacji skróconej CSS dla przejść
Przeczytaj opis „Skrócona notacja CSS”, aby uzyskać informacje o notacji skróconej CSS i korzyściach płynących z jej stosowania.
Wybierz polecenie Edycja > Preferencje.
Wybierz Style CSS.
W sekcji Użyj skrótów dla usuń zaznaczenie pozycji Przejście.
Tworzenie estetycznych serwisów internetowych w programie Dreamweaver
Projektowanie, pisanie kodu i zarządzanie dynamicznymi serwisami internetowymi za pomocą jednego, kompleksowego narzędzia.
