Kako stvoriti interaktivni HTML vremenski slijed

Autor: Frank Hunt
Datum Stvaranja: 20 Ožujak 2021
Datum Ažuriranja: 20 Studeni 2024
Anonim
Kako stvoriti interaktivni HTML vremenski slijed - Elektronika
Kako stvoriti interaktivni HTML vremenski slijed - Elektronika

Sadržaj

Vremenska crta koristan je način prikazivanja popisa događaja na web stranici, a interaktivna vremenska crta daje korisnicima kontrolu nad prikazom sadržaja. Iako postoji mnogo načina za stvaranje interaktivne vremenske trake, mnogima je potrebno više od HTML-a. Međutim, postoji vrlo jednostavno HTML rješenje: možete stvoriti interaktivne trake za pomicanje na vremenskoj traci pomoću HTML atributa "style". Na taj način korisnici će se moći slobodno kretati po sadržaju.

Korak 1

Stvorite svoju HTML datoteku. Otvorite novi dokument u uređivaču teksta i stvorite osnovnu HTML stranicu. Dodajte ovaj kôd u odjeljak "tijelo" HTML-a:

Razdjelnik ("div") je spremnik za popis događaja na vašoj vremenskoj traci. Vrijednost "auto" u "overflow" dodaje interaktivne trake za pomicanje kada je vremenska crta duža ili šira od spremnika. Spremite stranicu kao "timeline.html".


Korak 2

Stvorite sadržaj. U razmak između oznaka "div" dodajte događaje na vremenskoj traci uzlaznim ili silaznim redoslijedom. Dodajte svaki događaj u njegov vlastiti dobro oblikovan HTML odjeljak. Stalno spremajte stranicu dok radite.

3. korak

Testirajte svoj HTML kôd. Otvorite datoteku "timeline.html" u web pregledniku računala. Ako je sadržaj veći od spremnika "div", vidjet ćete interaktivnu traku za pomicanje. Podesite vrijednosti "širine" i "visine" spremnika tako da odgovaraju njegovom okomitom ili vodoravnom hodu.