Volite web dizajn?
Zašto ne podijelite svoje znanje s cijelim svijetom? Svatko može pisati za Kroativ i na taj način se promovirati.
HTML5 elementi, ukratko…
Uvod u HTML5 elemente
header
Kao što i samo ime govori to je prvi element na našoj stranici i u njega obično stavljamo logo i navigaciju. Sam header ne može u sebi imati drugi header niti footer.
Primjer nekada smo koristili:
<div id=“header“>sadržaj</div> |
A sada napišemo jednostavno:
<header>sadržaj</header> |
nav
Ovaj element nam služi za dodavanje navigacije na stranici. Možemo ga smjestiti bilo gdje na stranicu, a radi lakšeg određivanja gdje pripada možemo mu dodijeliti ID ili klasu.
Primjer:
<nav id=“main“></nav> <nav class=“bottom“></nav> |
hgroup
Spada u tzv. Sekcijsku grupu elamenata a odnosi se na heading elemente h1-h6 i njihovo grupiranje
Primjer:
<hgroup> <h1>O meni</h1> <h2>Zašto sam postao web dizajner</h2> </hgroup> |
section
Element nam služi za tematsko grupiranje sadržaja na stranicama. Može sadržavati h1-h6,article,paragrafe itd. Ako ćemo element koristiti radi stiliziranja onda je bolje koristiti div tag
Primjer:
<section> <h1>O meni</h1> <h2>Zašto sam postao web dizajner</h2> <article>text</article> </section> |
article
Ovaj element može biti samostalan ili umjesto taga section ili unutar njega.Koristit ćemo ga kad stavljamo neki članak na stranici.
Primjer:
<section> <article>text</article> </section> |
Primjer:
<article>text</article> |
aside
Aside element je sličan sidebaru ali on to nije. Koristimo ga ili za bloquote citate ili za izdvajanje pojedinog sdržaja a odnosi se na glavni sadržaj. Može sadržavati nav tag, paragrafe citate.
Primjer:
<aside> <nav></nav> </aside> |
figure i figcaaption
Koristimo kod stavljanja slika, fotografija na stranice, a figcaaption se odnosi na tekst ispod slika.
<figure> <img src=“my photo.jpg“ /> <figurecaption>Photo of me</figurecaption> </figure> |
footer
On je samostalan element koji se koristi za dodavanje kontakt informacija, copyright. Može se nalaziti bilo gdje na stranici, čak i u section tagu kao njegov footer.
Primjer:
<footer> <small>(c) Copyright www.webstranica.hr</small> </footer> |
Slični sadržaj:
- 13 besplatnih CMS opcija za web dizajn profesionalce (Srednje slično)
- Naučite kako ukrasiti forme sa CSS-om (Srednje slično)
- Stranica generirana za x.xxxx sekunde (Srednje slično)
- Kako se boriti protiv spam-a sa PHP-om? (Srednje slično)
- Hrvatski datum i vrijeme sa PHP-om (Srednje slično)
3 komentara
Trackbacks & Pingbacks
Ostavite komentar
Autori s više od 10 komentara nemaju tag nofollow na svojim linkovima! Zabranjeno je vrijeđanje, omalovažavanje ili na bilo koji drugi način ometanje normalnog toka komentara. Također je zabranjeno oglašavanje u komentarima i sve druge vrste spam-a.
super tekst sve pohvale
Vrlo koristan post!
Jednostavan i koristan tekst. Nadam se da se mogu na sajtu naci i komplikovanije stvari od ovoga. Uglavnom, svaka cast na trudu i tekstu.