Razlika između DIV-a i SPAN-a

i HTML su oznake koje definiraju elemente u HTML kodu.

HTML (Hypertext Markup Language) strukturirani je kôd koji se koristi za izgradnju i prikazivanje web stranica koje svakodnevno posjećujemo na bilo kojem uređaju.

Ostale tehnologije i programski jezici mogu se integrirati s HTML-om za pružanje dinamičnih i naprednih značajki na web mjestu.

Razumijevanje HTML-a

Jezik za označavanje hiperteksta (HTML) je široko korišten označni jezik i odnosi se na strukturu i kôd 'iza' web stranice koja se prikazuje u web pregledniku.

HTML je tekstualna datoteka koja koristi određeni kôd (sintaksu) za definiranje stila, sadržaja, izgleda i formata stranice. Markup Izraz označava da se tekst / kôd priprema za obradu i prezentaciju, tj. na web stranici, u web pregledniku.

Konzorcij World Wide Web (W3C) [i] prepoznaje HTML kao formalni označni jezik u razvoju web stranica, pa stoga HTML podržava većinu preglednika. Dakle, web stranice mogu se razviti na prepoznatljivom jeziku, lako ih tumače različiti preglednici kako bi se stranica mogla prikazati onako kako je to dizajner zamislio..

Trenutačna verzija koja se još uvijek koristi je HTML4, ali se polako ukida jer HTML5 dobiva veću podršku i prihvaćanje dinamičnih i brzih web stranica.

Odzivnost postaje temeljna komponenta u web razvoju kako bi se omogućilo lakše i dinamičnije korisničko iskustvo koje mora biti smješteno na više uređaja poput pametnih telefona, tableta i prijenosnih računala.

Kaskadni listovi stilova (CSS) postaje sastavni dio stvaranja dinamičnih i prilagodljivih stranica. To je zasebna datoteka koja definira atribute za svaki element poput fonta, boje, poravnanja, tako da programer ne mora naznačiti stil elementa svaki put kada se koristi u HTML kodu.

Osnovna struktura HTML-a

Da biste maksimalno iskoristili bilo koji razvojni jezik, pridržavanje standardne strukture datoteka i razmatranje najbolje upotrebe sintakse ključni su za postizanje stabilnog, svrhovitog i vizualno privlačnog web sadržaja.

HTML stranica ima strukturu definiranu elementima (koja se također nazivaju i oznakama). Pri pisanju HTML koda ovi se elementi prikazuju u paru - to znači da svaka oznaka treba otvaranje i zatvaranje. Početak i kraj.

Element se otvara sintaksom: i zatvorena sa.  / nagibna linija označava kraj definicije tog elementa.

Atributi i sadržaj elemenata definirani su između te dvije točke.

minimalni elementi potrebne za HTML datoteku su definicija,, (samo HTML4) i oznake.

• Definicija DOKTIPA

Definicija (DTD) prvo se mora deklarirati kao prva oznaka u HTML datoteci, pa kad stranica obrađuje, web preglednik zna o kojoj se vrsti datoteke radi, te stoga može ispravno protumačiti i prikazati stranicu.

U HTML4 postoje varijacije DTD-a (ovisno o atributima i elementima stranice), ali bi i tipičniji stavci bili uključeni kao:

ili

DTD u HTML5 je puno jednostavniji:

· HTML, GLAVA i TIJELO

• Oznaka označava da se radi o HTML datoteci i to je korijen HTML elementa koji sadrži sve ostale sljedeće elemente definirane u njemu; i uključujući jezični atribut preporučuje se kao najbolja praksa; na primjer:

• Zahtijeva se u HTML4, ali nije obvezna u HTML5. To je element koji sadrži druge elemente relevantne za ovaj dio dokumenta, poput naslova, referenciranja skripti, definiranja stilova i metapodataka. Prije definiranja oznake mora se koristiti zatvorena oznaka 
• Element sadrži glavni sadržaj stranice, uključujući tablice, tekst slike, popise itd. Nakon zatvaranja oznake, element sada može završiti. Upotreba novog elementa HTML5 nije obvezna za stranicu ili na drugom dijelu sadržaja.

HTML elementi

HTML5 je stvorio nove elemente za lakši razvoj i dizajn, a također je uklonio elemente koji se koriste u HTML4. Popis razlika između HTML4 i HTML5 objavio je World Wide Web Consortium (W3C) [ii].

HTML DIV TAG

Uz poboljšanja i nove elemente, u kombinaciji s napretkom CSS-a, određeni se elementi mogu koristiti na različite, bolje načine nego prije, a web stranice postaju brže, značajnije bogate i lijepe za gledanje! pomoću CSS-a, koji se koristi s HTML5, možete zamijeniti određene elemente koji su pretjerano korišteni, poput .

Oznaka je popularna kada segregira sadržaj na stranici. Prilikom stvaranja ovog elementa automatski umetne prijelom
da bi tekst ili sadržaj držali zajedno, umjesto da tekst nastavljate preko stranice.

S pristupačnošću web stranice i optimizacijom tražilice, tehnike postaju prilično znanost i WC3 ih preporučuje da se ne moraju uvijek vraćati na upotrebu u HTML5.

Kao primjer uredno strukturiranog, ali jednostavnog formata bloga, razmislite o novim HTML5 elementima s CSS-om, umjesto da koristite element; koristite element za glavni sadržaj, element za označavanje ili odvajanje bilo kojeg sadržaja na stranici, zaglavlja ili podnožja (bilo gdje!), a element se može koristiti za držanje veza do izbornika ili grupe za pretraživanje sa stranice.

Ovi novi elementi lako prepoznaju vrstu sadržaja pomoću HTML5. Međutim, oznaka se koristi i sa CSS-om za izradu responzivnih web stranica.

Stvarajući svaki element (sa svojim 'vlastitim id ili klasom), CSS datoteka može se definirati za manipuliranje svakim elementom.

Primjer HTML-a u nastavku prikazuje primjer upotrebe više elemenata:

Moji primjeri

Elementi mogu imati različite atribute, posebno različite veličine za reaktivnu interakciju, ovisno o veličini zaslona uređaja koji se koristi.

Evo primjera kako se svaki element može stilizirati u odgovarajućoj HTML CSS datoteci - referenciranjem svake oznake.

#Zaglavlje

širina: 800 piksela;

visina: auto

margin-left: auto;

margin-left: auto;

#Featured

visina: 150 piksela;

Background-color: #CCC;

HTML SPAN TAG

Element je inline element i ne probija se u crte osim ako nije lom
upotrebljava se oznaka i definirani tekst (sadržaj) između otvorenih i zatvorenih oznaka prikazuje se kao redak (prema zadanim postavkama bez upotrebe drugih elemenata).

Umetni elementi tekstualni su elementi u HTML datoteci i mogu se definirati u retku drugog elementa.

Kao, elementa nema značenje za optimalno referenciranje. U osnovi prikazuje sadržaj elementa kakav jest, ali sve instance se mogu definirati u CSS-u za oblikovanje ako su ispravno označene i obogaćene drugim atributima ili manipulirane JavaScript-om.

U donjem primjeru plavi tekst ističe kako se rasponski element može ugnijezditi kao inline element s različitim atributima nego nadređeni element - odlomak p>:

Da biste otvorili primjer, kliknite na ikonu pri dnu stranice.

Kada se gleda u web pregledniku, tekst u gornjem elementu bit će prikazan različitim fontom u odlomku kako bi naglasio gdje korisnik mora kliknuti kako bi pristupio primjeru.

Napominjemo da nema razlike između HTML4 i HTML5.