Näytän sinulle: sisällöllä on omat taginsa
HTML:ssä on oma tagi jokaiselle sisältötyypille. Näitä käytät eniten:
<h1>Main heading – only once per page</h1>
<h2>A chapter heading</h2>
<h3>A smaller heading inside a chapter</h3>
<p>An ordinary paragraph of text.</p>
<p>Another paragraph. Every paragraph gets its own <p> tag.</p>
<p>You can <strong>make words bold</strong> or <em>italic</em>.</p>Otsikot menevät <h1>:stä (suurin) alas <h6>:een (pienin). Se toimii kuin muistikirja: <h1> on kannen otsikko, <h2>:t ovat lukuja, <h3>:t alalukuja.
Listat
<!-- A bulleted list (ul = unordered list) -->
<ul>
<li>first thing</li>
<li>second thing</li>
</ul>
<!-- A numbered list (ol = ordered list) -->
<ol>
<li>step one</li>
<li>step two</li>
</ol>Jokainen listan kohta on <li>, ja ne on kääritty joko <ul>:ään (pallot) tai <ol>:iin (numerot).
Tuollainen outo rivi <!— text —> on kommentti – muistiinpano vain sinulle, selain jättää sen huomiotta. Ohjelmoijat jättävät tällaisia viestejä koodiin.
Nyt sinun vuorosi 💪
Täytä etusivusi sisällöllä. Siinä pitää olla:
- Yksi
<h1>(sinulla on jo), - vähintään kaksi lukua
<h2>-otsikolla ja tekstikappaleella, - vähintään yksi lista (
<ul>tai<ol>), - jotain lihavoitua
<strong>:lla.
Ideoita ja ratkaisuja projektiisi:
🏫 Koulun sivu – ideat ja ratkaisu
Luvut voivat olla: Tietoa koulustamme, Mitä tapahtuu, ja lista kerhoista.
<h1>Riverside Elementary School</h1>
<p>Welcome to our school's website.</p>
<h2>About Our School</h2>
<p>Our school has stood in Riverside for <strong>120 years</strong>. We have
350 students, a big gym, and a brand-new computer lab.</p>
<h2>Clubs</h2>
<ul>
<li>floorball</li>
<li>ceramics</li>
<li>coding</li>
<li>choir</li>
</ul>
<h2>Coming Up</h2>
<ol>
<li>outdoor school (June)</li>
<li>sports day</li>
<li>winter fair</li>
</ol>🙋 Henkilökohtainen sivu – ideat ja ratkaisu
Luvut voivat olla: Mitä pidän, Mitä osaan, lista suosikkipeleistä tai -kirjoista.
<h1>Hi, I'm Jake</h1>
<p>I'm 10 years old and this is my website.</p>
<h2>What I Like</h2>
<p>More than anything, I love <strong>soccer</strong> – I play for the youth team.
At home I build worlds in Minecraft and I'm learning to code.</p>
<h2>My Top Games</h2>
<ol>
<li>Minecraft</li>
<li>Mario Kart</li>
<li>Rocket League</li>
</ol>
<h2>What I Can Do</h2>
<ul>
<li>juggle a soccer ball</li>
<li>make pancakes</li>
<li>build a website (right now!)</li>
</ul>🌍 Matkapäiväkirja – ideat ja ratkaisu
Luvut voivat olla: Viimeisin matka, Minne seuraavaksi, lista maista joissa olet käynyt.
<h1>Where We've Been 🌍</h1>
<p>A journal of our trips and adventures.</p>
<h2>Last Trip: The Mountains</h2>
<p>Over the summer we hiked <strong>the whole ridge</strong>. Three days of
walking, one wrong turn, and a hundred wild berries.</p>
<h2>Countries I've Visited</h2>
<ul>
<li>United States</li>
<li>Canada</li>
<li>Mexico</li>
<li>Italy</li>
</ul>
<h2>Next Year's Plan</h2>
<ol>
<li>camping by the lake</li>
<li>mountains out west</li>
<li>the beach in Greece</li>
</ol>⚽ Seuran sivu – ideat ja ratkaisu
Luvut voivat olla: Tietoa seurasta, Viimeisimmät tulokset, pelaajalista listana.
<h1>Riverside Eagles FC</h1>
<p>The official website of our soccer club.</p>
<h2>About the Club</h2>
<p>We play in the district youth league. We train
<strong>Tuesdays and Thursdays at 5:00 PM</strong> on the field behind the school.</p>
<h2>Recent Results</h2>
<ol>
<li>Eagles – Hawks 3 : 1</li>
<li>Falcons – Eagles 2 : 2</li>
<li>Eagles – Wildcats 4 : 0</li>
</ol>
<h2>Roster</h2>
<ul>
<li>Jake – goalkeeper</li>
<li>Matt – defense</li>
<li>Owen – midfield</li>
<li>Tom – forward</li>
</ul>Tarkista itse: Sivulla on iso otsikko, pienemmät lukuotsikot, kappaleita ja vähintään yksi luettelo palloilla tai numeroilla. Se näyttää oikealta (vaikkakin vielä pukeutumattomalta) verkkosivulta.
Mitä opit tästä oppitunnista
- Otsikot
<h1>–<h6>järjestävät sivun kuin kirjan luvut. - Teksti menee
<p>-kappaleisiin; korosta sitä<strong>:lla ja<em>:llä. - Listat:
<ul>palloille,<ol>numeroille, kohteet aina<li>:ssä.
© 2026 Ing. Martin Polak / AlgoRhino · Sisällön käyttöehdot