Definicija HTML oznake

by Jennifer Kyrnin

Što trebate znati o HTML oznakama

HTML je jezik weba. Web stranice koje vidite na vašem računalu ili telefonu, uključujući ovo, napisane su u Hypertext Markup Languageu pomoću onoga što se naziva "HTML oznake". HTML se može smatrati "kodom ispod koda" koji upravlja strukturom web stranice.

Naposljetku, kada naučite bilo koji novi jezik, počnite s jednostavnim frazama i gradite od tamo. Učenje o HTML-u se ne razlikuje. Započeti ćete masterirati zajedničke HTML oznake. To je ekvivalent učenja "jednostavnih fraza" na govornom jeziku. Te fraze postaju temeljni temelj na kojem gradite svoje znanje i govor, baš kao što su HTML oznake temelj na kojem ćete graditi vještine razvoja web stranica.

Format HTML oznake

Možete prepoznati HTML oznaku jer je okružen znakovima na početku i kraju oznake. Između ta dva znaka bit će drugi tekst koji definira kakvu vrstu HTML oznake piše. Na primjer, ako znate da "hr" označava vodoravnu pravilu (ili redak), to biste napisali za HTML oznaku:

Upravo ste napisali HTML oznaku koja postavlja horizontalno pravilo na web stranici.

Većina HTML oznaka dolazi u paru. Postavljeni su na početku i na kraju dijela teksta kako bi diktirali sadržaj koji će sadržavati. Ovi tagovi čine HTML element s. Kada saznate i su oznake otvaranja i zatvaranja kako bi tekst bile podebljane, počinjete razumjeti kako HTML oznake utječu na izgled teksta na web stranici.

Ta će rečenica biti prikazana u svim podebljanim oznakama.

Napominjemo da oznaka za zatvaranje (koja označava "jaki naglasak i koja prema zadanim postavkama čini tekst kao podebljano) identična je podebljanoj oznaci otvaranja, osim što sadrži oznaku u oznaku. To je format koji slijedi većina HTML oznake. Oznaka za otvaranje i zatvaranje oznake su iste, uz dodavanje crte u zatvaranju koji slijedi prvi
Kombinacije HTML oznaka
HTML oznake često se koriste u kombinaciji. Oznake za otvaranje i zatvaranje naglašenog (kurzivog) teksta su i . Dodavanje kurzivnih oznaka jednoj riječi u sveobuhvatnom primjeru rečenice uzrokuje da se riječ pojavi i podebljano i kurzivom na web stranici.

Ta će rečenica biti prikazana u svim podebljanim oznakama.

Kad god se nekoliko elemenata koristi zajedno u elementu web stranice, a neke se oznake pojavljuju unutar drugih, nazivaju se kao ugniježđene HTML oznake. Morate se sjetiti da se ugnana oznaka, koja je oznaka unutar drugih, mora zatvoriti prije nego što se oznake koje sadrže mogu zatvoriti. Pogledajte ovaj primjer:

Ovo je tekst koji je naglašen za određeni razlog.
Primjetite da je oznaka otvorena unutar
, što znači da mora biti zatvorena prije nego se pojavi oznaka zatvaranja . Razmislite o smeđutim oznakama poput okvira unutar drugih okvira. Unutarnje kutije moraju biti zatvorene pred njihovim vanjskim prostorom, a sadrže kutije.

HTML oznake i web stranice
Postoje desetine HTML oznaka u važećem HTML-u. Neke HTML oznake diktiraju vrlo uobičajene, osnovne elemente kao što su odlomci, dok drugi su složenije i dodaju više funkcionalnosti, kao što su veze ili "sidro" oznake. Popis HTML oznaka daje kratki pregled mnogih funkcija koje oznake mogu izvesti na web stranici pomoću oznaka.

Postoje i neke oznake koje su potrebne za sve web stranice. Dok izrađujete svoju prvu stranicu, koristit ćete oznaku , koja počinje web stranicu; koji govori pregledniku što treba prikazati pri vrhu okna preglednika, a <body>, gdje je sve informacije o web stranici i najveći je dio vaše stranice. </p> <p> Popis HTML oznaka nije puno pomoći dok ne prođete HTML vodič, ali nakon toga možete koristiti HTML oznake za izradu vlastite web stranice. Jedna napomena, nemojte biti preopterećen brojem mogućih HTML oznaka. Iako postoje stotine mogućih oznaka koje treba upotrebljavati, stvarnost je da ćete vjerojatno ponovo upotrebljavati samo nekoliko njih. Zapravo, postoje neke HTML oznake koje nikad nisam koristio ni jednom u desetljećima rada na web dizajnu! </p> <h3> Obrisane oznake </h3><p> <a href="https://hr.eyewated.com/html-5-referenca-html-5-oznake-prema-abecedi/">HTML5</a> je trenutni standard označavanja. Neke od oznaka koje su se upotrebljavale u ranijim verzijama HTML-a sada obrađuju stilski listovi u HTML5. Obustavljene HTML oznake uklonjene su iz HTML specifikacija. Najbolje je ne upotrebljavati zastarjele oznake. </p> <p> Izvorni članak Jennifer Krynin. Uredio je Jeremy Girard na 5/2/17 </p> </div> <div class="amp-related-wrapper"> <h2>Alike posts</h2> <div class="amp-related-content"> <a href="https://hr.eyewated.com/saznajte-kako-jednostavno-pregledati-html-izvor-u-programu-internet-explorer/"> <amp-img src="https://exse.eyewated.com/pict/07331c3aefad30df-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/saznajte-kako-jednostavno-pregledati-html-izvor-u-programu-internet-explorer/">Saznajte kako jednostavno pregledati HTML izvor u programu Internet Explorer</a></h3> <div class="amp-related-meta"> Web dizajn i razvoj </div> </div> </div> <div class="amp-related-content"> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/kako-poslati-html-e-postu/">Kako poslati HTML e-poštu</a></h3> <div class="amp-related-meta"> Web dizajn i razvoj </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/saznajte-integralni-html-kodovi-za-ruske-cirilicne-znakove/"> <amp-img src="https://exse.eyewated.com/pict/34d67c22a08530c1-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/saznajte-integralni-html-kodovi-za-ruske-cirilicne-znakove/">Saznajte Integralni HTML kodovi za ruske (ćirilične) znakove</a></h3> <div class="amp-related-meta"> Web dizajn i razvoj </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/arena/"> <amp-img src="https://exse.eyewated.com/pict/fd0694f36f7534bf-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/arena/">Arena</a></h3> <div class="amp-related-meta"> Web dizajn i razvoj </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/zasto-koristiti-semanticki-html/"> <amp-img src="https://exse.eyewated.com/pict/8d74079c1c6b33e9-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/zasto-koristiti-semanticki-html/">Zašto koristiti semantički HTML?</a></h3> <div class="amp-related-meta"> Web dizajn i razvoj </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/testirajte-svoje-html-znanje-s-tim-kvizovima/"> <amp-img src="https://exse.eyewated.com/pict/a99b2cb77c01453f-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/testirajte-svoje-html-znanje-s-tim-kvizovima/">Testirajte svoje HTML znanje s tim kvizovima</a></h3> <div class="amp-related-meta"> Web dizajn i razvoj </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/sto-je-blockquote/"> <amp-img src="https://exse.eyewated.com/pict/22ac97c040112fe9-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/sto-je-blockquote/">Što je Blockquote?</a></h3> <div class="amp-related-meta"> Web dizajn i razvoj </div> </div> </div> <div class="amp-related-content"> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/sto-je-id-atribut/">Što je ID atribut?</a></h3> <div class="amp-related-meta"> Web dizajn i razvoj </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/saznajte-vise-o-upotrebi-html-validatora-za-pronalazenje-pogresaka/"> <amp-img src="https://exse.eyewated.com/pict/b1275ec04383338c-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/saznajte-vise-o-upotrebi-html-validatora-za-pronalazenje-pogresaka/">Saznajte više o upotrebi HTML Validatora za pronalaženje pogrešaka</a></h3> <div class="amp-related-meta"> Web dizajn i razvoj </div> </div> </div> </div> <div class="amp-related-wrapper"> <h2>See Newest</h2> <div class="amp-related-content"> <a href="https://hr.eyewated.com/9-najvecih-kontroverzi-u-povijesti-iphonea/"> <amp-img src="https://exse.eyewated.com/pict/c29b9f21f2b3335d-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/9-najvecih-kontroverzi-u-povijesti-iphonea/">9 najvećih kontroverzi u povijesti iPhonea</a></h3> <div class="amp-related-meta"> IPad </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/gdje-mogu-skinuti-windows-8-ili-8-1/"> <amp-img src="https://exse.eyewated.com/pict/a6a3d76b27be326e-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/gdje-mogu-skinuti-windows-8-ili-8-1/">Gdje mogu skinuti Windows 8 ili 8.1?</a></h3> <div class="amp-related-meta"> Windows </div> </div> </div> <div class="amp-related-content"> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/je-li-pravno-prodati-twitter-racun/">Je li pravno prodati Twitter račun?</a></h3> <div class="amp-related-meta"> Društveni mediji </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/savjeti-za-koristenje-appleove-adresara/"> <amp-img src="https://exse.eyewated.com/pict/7bae34267df938c6-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/savjeti-za-koristenje-appleove-adresara/">Savjeti za korištenje Appleove adresara</a></h3> <div class="amp-related-meta"> Macove </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/html5-vs-flash-internet-speed-%E2%80%8B%E2%80%8Btest-koji-je-bolji/"> <amp-img src="https://exse.eyewated.com/pict/a5c330ba22474297-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/html5-vs-flash-internet-speed-%E2%80%8B%E2%80%8Btest-koji-je-bolji/">HTML5 vs Flash Internet Speed Test: Koji je bolji?</a></h3> <div class="amp-related-meta"> Internet i mreža </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/sada-mozete-gledati-twitter-na-apple-tv-u/"> <amp-img src="https://exse.eyewated.com/pict/6927f0f8086f3396-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/sada-mozete-gledati-twitter-na-apple-tv-u/">Sada možete gledati Twitter na Apple TV-u</a></h3> <div class="amp-related-meta"> Softver i aplikacije </div> </div> </div> </div> <div class="amp-related-wrapper"> <h2>Sapid posts</h2> <div class="amp-related-content"> <a href="https://hr.eyewated.com/razumijevanje-nacina-infrastrukture-u-bezicnom-umrezavanju/"> <amp-img src="https://exse.eyewated.com/pict/207df1913161479d-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/razumijevanje-nacina-infrastrukture-u-bezicnom-umrezavanju/">Razumijevanje načina infrastrukture u bežičnom umrežavanju</a></h3> <div class="amp-related-meta"> Internet i mreža </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/uskrsli-sims-u-the-sims-3/"> <amp-img src="https://exse.eyewated.com/pict/e7b4418149bf390d-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/uskrsli-sims-u-the-sims-3/">Uskrsli Sims u The Sims 3</a></h3> <div class="amp-related-meta"> Kockanje </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/10-great-ipad-precaci-kako-bi-vas-zivot-laksim/"> <amp-img src="https://exse.eyewated.com/pict/3a1900f950553582-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/10-great-ipad-precaci-kako-bi-vas-zivot-laksim/">10 Great iPad prečaci kako bi vaš život lakšim</a></h3> <div class="amp-related-meta"> IPad </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/kako-kompaktirati-pst-datoteku-u-programu-outlook/"> <amp-img src="https://exse.eyewated.com/pict/e31874c522c342bf-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/kako-kompaktirati-pst-datoteku-u-programu-outlook/">Kako kompaktirati PST datoteku u programu Outlook</a></h3> <div class="amp-related-meta"> E-pošta i Poruke </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/kako-dodati-albumu-u-windows-media-playeru-11/"> <amp-img src="https://exse.eyewated.com/pict/9746cbf2797434a4-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/kako-dodati-albumu-u-windows-media-playeru-11/">Kako dodati albumu u Windows Media Playeru 11</a></h3> <div class="amp-related-meta"> Softver i aplikacije </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/10-popularni-gmail-alati-koji-se-gnjavazu-iz-e-poste/"> <amp-img src="https://exse.eyewated.com/pict/ab6a4432897733a9-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/10-popularni-gmail-alati-koji-se-gnjavazu-iz-e-poste/">10 Popularni Gmail Alati koji se gnjavažu iz e-pošte</a></h3> <div class="amp-related-meta"> E-pošta i Poruke </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/ispravljanje-fiksnog-oblika-u-photoshopovom-alatu-za-obradu/"> <amp-img src="https://exse.eyewated.com/pict/211698c1cb753417-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/ispravljanje-fiksnog-oblika-u-photoshopovom-alatu-za-obradu/">Ispravljanje fiksnog oblika u Photoshopovom alatu za obradu</a></h3> <div class="amp-related-meta"> Softver </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/tekstni-ucinci-u-illustrator-cs-visestruki-potezi-na-tipu/"> <amp-img src="https://exse.eyewated.com/pict/d3d4b2579ca1306a-120x86.gif" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/tekstni-ucinci-u-illustrator-cs-visestruki-potezi-na-tipu/">Tekstni učinci u Illustrator CS - višestruki potezi na tipu</a></h3> <div class="amp-related-meta"> Softver </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/kako-pronaci-bilo-koga-online/"> <amp-img src="https://exse.eyewated.com/pict/cbeaecc2d35e35b7-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/kako-pronaci-bilo-koga-online/">Kako pronaći bilo koga online</a></h3> <div class="amp-related-meta"> Internet pretraga </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/sto-cini-drugaciji-googleova-aplikacija-za-slanje-videozapisa-za-pozive/"> <amp-img src="https://exse.eyewated.com/pict/f88ae293924f4407-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/sto-cini-drugaciji-googleova-aplikacija-za-slanje-videozapisa-za-pozive/">Što čini drugačiji Googleova aplikacija za slanje videozapisa za pozive</a></h3> <div class="amp-related-meta"> Softver i aplikacije </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/kako-pronaci-i-koristiti-vasu-facebook-kartu-za-prijavu/"> <amp-img src="https://exse.eyewated.com/pict/31ffbe07e80c41c9-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/kako-pronaci-i-koristiti-vasu-facebook-kartu-za-prijavu/">Kako pronaći i koristiti vašu Facebook kartu za prijavu</a></h3> <div class="amp-related-meta"> Društveni mediji </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/orijsko-i-slijepa-suma-definitivno-izdanje-info/"> <amp-img src="https://exse.eyewated.com/pict/c5e5a3ef9a572fd9-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/orijsko-i-slijepa-suma-definitivno-izdanje-info/">Orijsko i slijepa šuma Definitivno izdanje Info</a></h3> <div class="amp-related-meta"> Kockanje </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/koliko-brzo-je-4g-lte-bezicna-usluga/"> <amp-img src="https://exse.eyewated.com/pict/ccaebd19e38a305b-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/koliko-brzo-je-4g-lte-bezicna-usluga/">Koliko brzo je 4G LTE bežična usluga?</a></h3> <div class="amp-related-meta"> Android </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/kako-zastititi-mrezu-od-prirodne-katastrofe/"> <amp-img src="https://exse.eyewated.com/pict/28b01223e9d33583-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/kako-zastititi-mrezu-od-prirodne-katastrofe/">Kako zaštititi mrežu od prirodne katastrofe</a></h3> <div class="amp-related-meta"> Internet i mreža </div> </div> </div> <div class="amp-related-content"> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/192-168-1-2-ip-adresa-zajednickog-usmjerivaca/">192.168.1.2: IP adresa zajedničkog usmjerivača</a></h3> <div class="amp-related-meta"> Internet i mreža </div> </div> </div> <div class="amp-related-content"> <a href="https://hr.eyewated.com/prvi-dan-na-internetu-kid-top-ten-memes/"> <amp-img src="https://exse.eyewated.com/pict/886fd0eec8ba386d-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://hr.eyewated.com/prvi-dan-na-internetu-kid-top-ten-memes/">Prvi dan na internetu Kid - Top Ten Memes</a></h3> <div class="amp-related-meta"> Internet pretraga </div> </div> </div> </div></article> <footer class="amp-wp-footer"> <div class="amp-wp-footer-inner"> <a href="#" class="back-to-top">Back to top</a> <p class="copyright"> © 2024 hr.eyewated.com </p> <div class="amp-wp-social-footer"> <a href="#" class="jeg_facebook"><i class="fa fa-facebook"></i> </a><a href="#" class="jeg_twitter"><i class="fa fa-twitter"></i> </a><a href="#" class="jeg_google-plus"><i class="fa fa-google-plus"></i> </a><a href="#" class="jeg_pinterest"><i class="fa fa-pinterest"></i> </a><a href="" class="jeg_rss"><i class="fa fa-rss"></i> </a> </div> </div> </footer> <div id="statcounter"> <amp-pixel src="https://c.statcounter.com/12022999/0/02d06b5d/1/"> </amp-pixel> </div> </body> </html>