HTML Tag Definisie

by Jennifer Kyrnin

Wat jy moet weet oor HTML-etikette

HTML is die taal van die web. Die webbladsye wat jy op jou rekenaar of selfoon sien, insluitend hierdie een, word in Hypertext Markup Language geskryf deur gebruik te maak van wat bekend staan as "HTML tags". Jy kan aan HTML dink as die "onder-die-kap-kode" wat die struktuur van 'n webblad beheer.

Uiteindelik, wanneer u enige nuwe taal leer, begin u met eenvoudige frases en bou daarvandaan. Leer oor HTML is nie anders nie. Jy sal begin deur algemene HTML-tags te bemeester. Dit is die ekwivalent van die lees van "eenvoudige frases" in 'n gesproke taal. Hierdie frases word die grondslag waarop jy jou kennis en spraak bou, net soos HTML-koördinate die grondslag is waarop jy jou webontwikkelingsvaardighede sal opbou.

HTML Tag Format

U kan 'n HTML-tag herken omdat dit omring word deur die karakters aan die begin en einde van die tag. Tussen hierdie twee karakters sal ander teks wees wat definieer watter soort HTML-kode geskryf word. As u byvoorbeeld weet dat "hr" horisontale reël (of lyn) beteken, sou u dit vir die HTML-tag skryf:

Jy het pas 'n HTML-tag geskryf wat 'n horisontale reël op 'n webblad teken.

Die meeste HTML-etikette kom in pare. Hulle word aan die begin en aan die einde van 'n gedeelte van die teks geplaas om die inhoud wat hulle sal bevat, te dikteer. Hierdie tagpaar maak HTML-elemente op . As jy dit leer en is die opening- en sluittekens om teks vet te maak, jy begin verstaan hoe HTML-tags die voorkoms van teks op 'n webblad beïnvloed.

Hierdie sin sal as gevolg van die etikette in vetdruk verskyn.

Let daarop dat die afsluitende sterk merker (wat vir "sterk klem en wat standaard die teks as vetdruk gee) identies is aan die oopgemaakte tag, behalwe dat dit 'n sny in die tag bevat. Dit is die formaat wat gevolg word deur die meeste HTML-etikette. Die openingsteken en sluitingsetikette is dieselfde, met die toevoeging van 'n sny in die sluiting wat volg op die eerste
HTML-tag kombinasies
HTML-etikette word dikwels in kombinasie gebruik. Die opening- en sluitingsetikette vir beklemtoonde (kursiewe) teks is en . As u die kursiewe etikette by 'n enkele woord in die vetgedrukte sinvoorbeeld voeg, veroorsaak die woord wat verskyn, vet en kursief op die webblad.

Hierdie sin sal as gevolg van die etikette in vetdruk verskyn.

Wanneer verskeie etikette saam in 'n element van 'n webblad gebruik word, met sommige etikette wat binne-in ander voorkom, word dit na verwys as geneste HTML-etikette. U moet onthou dat 'n geneste tag, wat die etikette in ander is, moet gesluit wees voordat hul etikette gesluit kan word. Kyk na hierdie voorbeeld:

Dit is 'n teks wat beklemtoon word vir 'n spesifieke rede.
U moet oplet dat die -tag oopgemaak word binne die
, wat beteken dat dit gesluit moet word voordat die sluitingsetjie verskyn. Dink aan geneste etikette soos bokse binne van ander bokse. Binne bokse moet gesluit word voor hulle buite, wat bokse bevat.

HTML-etikette en webbladsye
Daar is dosyne HTML-etikette in geldige HTML. Sommige HTML-tags dikteer baie algemeen, basiese elemente soos paragrawe, terwyl ander meer ingewikkeld is en voeg meer funksionaliteit, soos skakel- of anker-etikette. 'N lys van HTML-etikette gee 'n momentopname van die vele funksies wat tags op 'n webblad kan gebruik met behulp van etikette.

Daar is ook 'n paar tags wat van alle webblaaie benodig word. As jy jou eerste bladsy bou, gebruik jy die tag , wat 'n webblad begin; wat die leser vertel wat bo aan die blaaier se venster moet verskyn, en <body>, waar die hele webbladinligting gaan en die grootste deel van jou bladsy is. </p> <p> 'N Lys van HTML-etikette is nie veel help totdat jy 'n HTML-tutoriaal deurgegaan het nie, maar nadat jy dit gedoen het, kan jy HTML-tags gebruik om jou eie webblad te bou. Een noot, moenie oorweldig word deur die aantal moontlike HTML-etikette nie. Alhoewel daar honderde moontlike etikette is om te gebruik, is die realiteit dat jy waarskynlik net 'n handjievol van hulle oor en oor gebruik. Trouens, daar is 'n paar HTML-tags wat ek nog nooit een keer in my dekades van webontwerpwerk gebruik het nie! </p> <h3> Uitgedateerde etikette </h3><p> <a href="https://af.eyewated.com/html-5-verwysing-html-5-tags-alfabeties/">HTML5</a> is die huidige opmaak standaard. Sommige van die etikette wat in vorige weergawes van HTML gebruik is, word nou hanteer deur style sheets in HTML5. Die verouderde HTML-etikette is verwyder van die HTML-spesifikasies. Dit is die beste om geen verouderde etikette te gebruik nie. </p> <p> Oorspronklike artikel deur Jennifer Krynin. Geredigeer deur Jeremy Girard op 5/2/17 </p> </div> <div class="amp-related-wrapper"> <h2>Alike posts</h2> <div class="amp-related-content"> <a href="https://af.eyewated.com/wat-is-die-verskil-tussen-th-en-td-html-tabel-tags/"> <amp-img src="https://exse.eyewated.com/pict/e20233b2c6ba3161-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/wat-is-die-verskil-tussen-th-en-td-html-tabel-tags/">Wat is die verskil tussen TH en TD HTML Tabel Tags?</a></h3> <div class="amp-related-meta"> Webontwerp en Dev </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/html-scroll-box/"> <amp-img src="https://exse.eyewated.com/pict/f47bdac8d880303c-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/html-scroll-box/">HTML Scroll Box</a></h3> <div class="amp-related-meta"> Webontwerp en Dev </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/html-kodes-vir-poolse-taal-karakters/"> <amp-img src="https://exse.eyewated.com/pict/3a843da345b63435-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/html-kodes-vir-poolse-taal-karakters/">HTML-kodes vir Poolse taal karakters</a></h3> <div class="amp-related-meta"> Webontwerp en Dev </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/hoe-om-n-word-doc-na-html-te-omskep/"> <amp-img src="https://exse.eyewated.com/pict/aea5b69ee3ce2fdb-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/hoe-om-n-word-doc-na-html-te-omskep/">Hoe om 'n Word Doc na HTML te omskep</a></h3> <div class="amp-related-meta"> Webontwerp en Dev </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/hoekom-gebruik-semantiese-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://af.eyewated.com/hoekom-gebruik-semantiese-html/">Hoekom gebruik Semantiese HTML?</a></h3> <div class="amp-related-meta"> Webontwerp en Dev </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/n-omvattende-lys-van-html-kodes-vir-turkse-taal-karakters/"> <amp-img src="https://exse.eyewated.com/pict/c2d45c92534f347a-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/n-omvattende-lys-van-html-kodes-vir-turkse-taal-karakters/">'N Omvattende lys van HTML-kodes vir Turkse Taal Karakters</a></h3> <div class="amp-related-meta"> Webontwerp en Dev </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/n-inleiding-tot-bluefish-text-html-editor/"> <amp-img src="https://exse.eyewated.com/pict/1c9b46d24949324c-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/n-inleiding-tot-bluefish-text-html-editor/">'N Inleiding tot Bluefish Text HTML Editor</a></h3> <div class="amp-related-meta"> Webontwerp en Dev </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/hoe-om-die-html-bron-in-google-chrome-te-besigtig/"> <amp-img src="https://exse.eyewated.com/pict/adff2724bc843500-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/hoe-om-die-html-bron-in-google-chrome-te-besigtig/">Hoe om die HTML-bron in Google Chrome te besigtig</a></h3> <div class="amp-related-meta"> Webontwerp en Dev </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/kommentaar-op-kommentaar/"> <amp-img src="https://exse.eyewated.com/pict/fbec9317d5d73059-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/kommentaar-op-kommentaar/">Kommentaar op Kommentaar</a></h3> <div class="amp-related-meta"> Webontwerp en Dev </div> </div> </div> </div> <div class="amp-related-wrapper"> <h2>See Newest</h2> <div class="amp-related-content"> <a href="https://af.eyewated.com/inleiding-tot-die-gekoppelde-huis/"> <amp-img src="https://exse.eyewated.com/pict/e369f4fd89ff352a-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/inleiding-tot-die-gekoppelde-huis/">Inleiding tot die gekoppelde huis</a></h3> <div class="amp-related-meta"> Nuwe en Volgende </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/hoe-toegang-tot-gratis-windows-live-hotmail-in-outlook-express/"> <amp-img src="https://exse.eyewated.com/pict/2fb0413525733f66-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/hoe-toegang-tot-gratis-windows-live-hotmail-in-outlook-express/">Hoe toegang tot gratis Windows Live Hotmail in Outlook Express</a></h3> <div class="amp-related-meta"> E-pos en boodskappe </div> </div> </div> <div class="amp-related-content"> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/hoe-om-svg-graphics-op-jou-webblad-te-plaas/">Hoe om SVG Graphics op jou webblad te plaas</a></h3> <div class="amp-related-meta"> Webontwerp en Dev </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/hoe-om-die-berging-op-jou-ipad-uit-te-brei/"> <amp-img src="https://exse.eyewated.com/pict/41f903f62ce137a6-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/hoe-om-die-berging-op-jou-ipad-uit-te-brei/">Hoe om die berging op jou iPad uit te brei</a></h3> <div class="amp-related-meta"> IPad </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/jou-apple-tv-instel/"> <amp-img src="https://exse.eyewated.com/pict/50bcc855ddd032cb-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/jou-apple-tv-instel/">Jou Apple TV instel</a></h3> <div class="amp-related-meta"> Sagteware en programme </div> </div> </div> <div class="amp-related-content"> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/html-redakteurs-en-webblad-redakteurs/">HTML redakteurs en webblad redakteurs</a></h3> <div class="amp-related-meta"> Webontwerp en Dev </div> </div> </div> </div> <div class="amp-related-wrapper"> <h2>Sapid posts</h2> <div class="amp-related-content"> <a href="https://af.eyewated.com/little-big-planet-3-ps4-review/"> <amp-img src="https://exse.eyewated.com/pict/70cadb2af4213632-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/little-big-planet-3-ps4-review/">Little Big Planet 3 PS4 Review</a></h3> <div class="amp-related-meta"> Gaming </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/kragbesparingswenke-vir-jou-mp3-speler-se-battery/"> <amp-img src="https://exse.eyewated.com/pict/2ca1660c6e733437-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/kragbesparingswenke-vir-jou-mp3-speler-se-battery/">Kragbesparingswenke vir jou MP3-speler se battery</a></h3> <div class="amp-related-meta"> Web & Soek </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/wise-data-recovery-v3-87-205/"> <amp-img src="https://exse.eyewated.com/pict/c31410e7faeb3b77-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/wise-data-recovery-v3-87-205/">Wise Data Recovery v3.87.205</a></h3> <div class="amp-related-meta"> Sagteware en programme </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/samsung-series-3-np305e5a-a07us-156-inch-laptop-pc/"> <amp-img src="https://exse.eyewated.com/pict/3bb2dd6f7f6233b2-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/samsung-series-3-np305e5a-a07us-156-inch-laptop-pc/">Samsung Series 3 NP305E5A-A07US 15,6-inch Laptop PC</a></h3> <div class="amp-related-meta"> Koop wenke </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/plante-vs-zombies-cheats-xbox-360/"> <amp-img src="https://exse.eyewated.com/pict/6814e6e3896c357e-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/plante-vs-zombies-cheats-xbox-360/">Plante vs Zombies Cheats - Xbox 360</a></h3> <div class="amp-related-meta"> Gaming </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/motor-usb-poort-nie-laai-telefoon/"> <amp-img src="https://exse.eyewated.com/pict/cb879283b7613a52-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/motor-usb-poort-nie-laai-telefoon/">Motor USB-poort Nie-laai-telefoon</a></h3> <div class="amp-related-meta"> Motor Tech </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/windows-10-game-bar/"> <amp-img src="https://exse.eyewated.com/pict/52518f7f5f642fe7-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/windows-10-game-bar/">Windows 10 Game Bar</a></h3> <div class="amp-related-meta"> Windows </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/skep-databasisverhoudings-in-toegang/"> <amp-img src="https://exse.eyewated.com/pict/50c2b0a48bff3605-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/skep-databasisverhoudings-in-toegang/">Skep databasisverhoudings in toegang</a></h3> <div class="amp-related-meta"> Sagteware </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/hoe-om-n-vinnige-iphone-groep-e-pos-in-ios-mail-te-stuur/"> <amp-img src="https://exse.eyewated.com/pict/7cde9ef00b0f3598-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/hoe-om-n-vinnige-iphone-groep-e-pos-in-ios-mail-te-stuur/">Hoe om 'n Vinnige iPhone Groep E-pos in iOS Mail te stuur</a></h3> <div class="amp-related-meta"> IPhone en iPod </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/hier-is-n-maklike-manier-om-die-onderstreep-van-skakels-in-html-te-verwyder/"> <amp-img src="https://exse.eyewated.com/pict/bb62cff12717371f-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/hier-is-n-maklike-manier-om-die-onderstreep-van-skakels-in-html-te-verwyder/">Hier is 'n maklike manier om die onderstreep van skakels in HTML te verwyder</a></h3> <div class="amp-related-meta"> Webontwerp en Dev </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/besigheid-sosiale-netwerke/"> <amp-img src="https://exse.eyewated.com/pict/b1adba6167463207-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/besigheid-sosiale-netwerke/">Besigheid Sosiale Netwerke</a></h3> <div class="amp-related-meta"> Sosiale media </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/gebruik-spotlight-met-boolean-en-metadata-operateurs/"> <amp-img src="https://exse.eyewated.com/pict/645bd7eb6c6337cf-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/gebruik-spotlight-met-boolean-en-metadata-operateurs/">Gebruik Spotlight met Boolean en Metadata Operateurs</a></h3> <div class="amp-related-meta"> Macs </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/hoe-om-liedjies-wat-van-itunes-gratis-gekoop-is-te-herlaai/"> <amp-img src="https://exse.eyewated.com/pict/387fe167f66136f5-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/hoe-om-liedjies-wat-van-itunes-gratis-gekoop-is-te-herlaai/">Hoe om liedjies wat van iTunes gratis gekoop is, te herlaai</a></h3> <div class="amp-related-meta"> IPhone en iPod </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/diy-computer-forensics-hoe-om-n-verwyderde-leer-te-herstel/"> <amp-img src="https://exse.eyewated.com/pict/22078c4cb91d2fb2-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/diy-computer-forensics-hoe-om-n-verwyderde-leer-te-herstel/">DIY Computer Forensics: Hoe om 'n verwyderde lêer te herstel</a></h3> <div class="amp-related-meta"> Web & Soek </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/hoe-media-giet-in-microsoft-edge-vir-windows-gebruik/"> <amp-img src="https://exse.eyewated.com/pict/57d621f933c33409-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/hoe-media-giet-in-microsoft-edge-vir-windows-gebruik/">Hoe media giet in Microsoft Edge vir Windows gebruik</a></h3> <div class="amp-related-meta"> Windows </div> </div> </div> <div class="amp-related-content"> <a href="https://af.eyewated.com/winbook-ondersteuning/"> <amp-img src="https://exse.eyewated.com/pict/c2b007bd7a6c355e-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://af.eyewated.com/winbook-ondersteuning/">Winbook Ondersteuning</a></h3> <div class="amp-related-meta"> Meer hulp kry </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 af.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>