Jak utworzyć interaktywną oś czasu za pomocą HTML

Tworzenie interaktywnej osi czasu za pomocą HTML wymaga bardzo mało czasu.

Krok 1

Utwórz swój plik HTML. Otwórz nowy dokument w edytorze tekstu i utwórz podstawową stronę HTML. Dodaj ten kod w sekcji "body" strony:

Element podziału ("div") jest kontenerem listy zdarzeń na osi czasu. Wartość "przelewu" "auto" (automatyzacja) dodaje interaktywny pasek przewijania, gdy oś czasu staje się szersza lub wyższa od kontenera. Zapisz tę stronę jako "timeline.html".

Krok 2

Utwórz zawartość osi czasu. W przestrzeni między znacznikami "div" otwierania i zamykania dodaj zdarzenia w porządku malejącym lub rosnącym. Dodaj każde wydarzenie za pomocą własnej dobrze uformowanej sekcji HTML. Podczas pracy nad tym utrzymuj stałą stronę.

Krok 3

Przetestuj swój kod HTML Otwórz przeglądarkę komputera i załaduj plik "timeline.html". Jeśli zawartość jest większa niż kontener "div", zobaczysz interaktywny pasek przewijania. Dostosuj wartości "width" i "height", aby dopasować je do pionowego lub poziomego układu strony.