Johdanto HTML:ään Sisällön Jäsentämiseksi
HTML, verkkosivujen perusta, määrittää niiden rakenteen ja sisällön. Sitä voi verrata talon perustuksiin, seiniin, oveen ja kattoon.
HTML koostuu olennaisesti elementeistä, jotka on suljettu kulmasulkeisiin (<>) ja esiintyvät yleensä pareittain – avaus- ja lopetustagi. Nämä elementit muodostavat hierarkkisen rakenteen, jossa jotkin elementit voivat olla sisäkkäin muiden kanssa luoden merkityksellisen asettelun.
Esimerkki:
Napsauta Suorita koodi -painiketta nähdäksesi verkkosivun toiminnassa.
index.html
Erilaisten tagien lisääminen HTML:ään
HTML:ssä voidaan käyttää erilaisia tageja erilaisten sisältöjen, kuten tekstin, kuvien, linkkien ja muiden, lisäämiseen verkkosivulle. Näin voidaan lisätä tekstiä, kuvia, linkkejä ja muuta sisältöä:
Tekstin lisääminen
Tekstin lisäämiseen verkkosivulle käytetään <p>-tägiä kappaleille sekä <h1>–<h6>-tageja eri tasoisille otsikoille.
index.html
Kuvien lisääminen
Kuvien lisäämiseen käytetään <img>-tägiä. Määrittele kuvan lähde (src-attribuutti) ja halutessasi lisää attribuutteja, kuten alt vaihtoehtoiselle tekstille sekä width ja height mitoille.
<img src="image.jpg" alt="Description of the image" width="300" height="200" />
Linkkien lisääminen
Hyperlinkkien lisäämiseen muihin verkkosivuihin tai resursseihin käytetään <a>-tagia. Kohdesivun URL-osoite määritetään href-attribuutilla.
index.html
Listojen lisääminen
Järjestettyjen (numeroitujen) tai järjestämättömien (pallotettujen) listojen luomiseen käytetään vastaavasti <ol>- ja <ul>-tageja. Näiden tagien sisällä käytetään <li>-tagia jokaiselle listan kohdalle.
index.html
Lomakkeiden lisääminen
Käyttäjän syötteiden keräämiseen voidaan käyttää erilaisia lomakkeisiin liittyviä tunnisteita, kuten <form>, <input> ja <button>.
index.html
Voimme lisätä verkkosivulle monenlaista sisältöä näiden HTML-tunnisteiden avulla, yksinkertaisesta tekstistä ja kuvista aina interaktiivisiin lomakkeisiin asti. Alta löydät verkkosivun, jossa käytetyt tunnisteet on huomioitu.
index.html
Videotutoriaali
Kiitos palautteestasi!
Kysy tekoälyä
Kysy tekoälyä
Kysy mitä tahansa tai kokeile jotakin ehdotetuista kysymyksistä aloittaaksesi keskustelumme
Can you explain more about the different HTML tags and their uses?
How do I add images and links to my web page?
What is the purpose of using forms in HTML?
Awesome!
Completion rate improved to 5Johdanto HTML:ään Sisällön Jäsentämiseksi
Pyyhkäise näyttääksesi valikon
HTML, verkkosivujen perusta, määrittää niiden rakenteen ja sisällön. Sitä voi verrata talon perustuksiin, seiniin, oveen ja kattoon.
HTML koostuu olennaisesti elementeistä, jotka on suljettu kulmasulkeisiin (<>) ja esiintyvät yleensä pareittain – avaus- ja lopetustagi. Nämä elementit muodostavat hierarkkisen rakenteen, jossa jotkin elementit voivat olla sisäkkäin muiden kanssa luoden merkityksellisen asettelun.
Esimerkki:
Napsauta Suorita koodi -painiketta nähdäksesi verkkosivun toiminnassa.
index.html
Erilaisten tagien lisääminen HTML:ään
HTML:ssä voidaan käyttää erilaisia tageja erilaisten sisältöjen, kuten tekstin, kuvien, linkkien ja muiden, lisäämiseen verkkosivulle. Näin voidaan lisätä tekstiä, kuvia, linkkejä ja muuta sisältöä:
Tekstin lisääminen
Tekstin lisäämiseen verkkosivulle käytetään <p>-tägiä kappaleille sekä <h1>–<h6>-tageja eri tasoisille otsikoille.
index.html
Kuvien lisääminen
Kuvien lisäämiseen käytetään <img>-tägiä. Määrittele kuvan lähde (src-attribuutti) ja halutessasi lisää attribuutteja, kuten alt vaihtoehtoiselle tekstille sekä width ja height mitoille.
<img src="image.jpg" alt="Description of the image" width="300" height="200" />
Linkkien lisääminen
Hyperlinkkien lisäämiseen muihin verkkosivuihin tai resursseihin käytetään <a>-tagia. Kohdesivun URL-osoite määritetään href-attribuutilla.
index.html
Listojen lisääminen
Järjestettyjen (numeroitujen) tai järjestämättömien (pallotettujen) listojen luomiseen käytetään vastaavasti <ol>- ja <ul>-tageja. Näiden tagien sisällä käytetään <li>-tagia jokaiselle listan kohdalle.
index.html
Lomakkeiden lisääminen
Käyttäjän syötteiden keräämiseen voidaan käyttää erilaisia lomakkeisiin liittyviä tunnisteita, kuten <form>, <input> ja <button>.
index.html
Voimme lisätä verkkosivulle monenlaista sisältöä näiden HTML-tunnisteiden avulla, yksinkertaisesta tekstistä ja kuvista aina interaktiivisiin lomakkeisiin asti. Alta löydät verkkosivun, jossa käytetyt tunnisteet on huomioitu.
index.html
Videotutoriaali
Kiitos palautteestasi!
