20. Html ja CSS, kuvagalleria
Html ja CSS tehtävä 3, kuvagalleria
Mene w3school-sivustolle ja siellä CSS ja Image Gallery.
https://www.w3schools.com/css/css_image_gallery.asp
Avaa ensimmäinen esimerkki Try it Yourself. Esimerkissä on kuvagalleria, jossa esikatselukuvat = pikkukuvat. Pikkukuviin voi kirjoittaa myös esittelytekstin. Pikkukuvaa klikkaamalla aukeaa iso kuva uudessa välilehdessä. Tutki esimerkin koodia ensin style-osiossa. Kokeile vaihtaa koodiin eri numeroarvoja, niin näet vaikutuksen. Vastaa sitten tämän sivun kysymyksiin style-osiosta.
Vastaa näihin CSS-osiota (style) koskeviin kysymyksiin
Oma kuvagalleria
Tee sitten oma kuvagalleria haluamastasi aiheesta. Voit katsoa apuja alla olevasta kuvasta. jossa on selitetty yhden kuvagallerian kuvan koodi. Kun rakennat kuvagalleriaa, niin tee ensin kansio, johon tallennat sekä html-tiedoston että kuvat. Palauta galleria tämän sivun palautuslaatikkoon. Voit palautaa pelkän html-tiedoston ilman kuvia.
kuvagallerian yhden kuvan koodin selitykset
Palauta tänne kuvagalleria-tiedosto
Sinulla ei ole tarvittavia oikeuksia lähettää mitään.