html-märgendite omadused. Mis on HTML-sildid ja mis tüüpi sildid on olemas

Tere, kallid ajaveebisaidi lugejad. Tegelikult on sellel terminil mitu tähendust, mis ei sobi kuidagi kokku. Püüan neist igaühest selles väljaandes rääkida.

Sa saad teada mis on HTML-sildid ja kuidas need erinevad metamärgenditest, ning õppida ka seda, kuidas silte saitidel märgenditena kasutatakse (nende mitmekesisus on ), ja lõpuks vaatame muusikali üldiselt sildid helifailides. Nii muutub see termin mitmetahuliseks.

Kuid kõigil juhtudel sõna "sildid" tähendab märgistust kas HTML-koodi kasutav veebileht või siltide abil kogu sait või teie muusikakogu, märkides albumi ja laulu.

Mis on veebisaidil olevad sildid (navigeerimise loomiseks mõeldud sildid)

Alustame lihtsast. Tõenäoliselt olete kõik näinud, et mõne veebisaidi artikli all on väli nimega sildid või sildid, kus on loetletud mõned sõnad. Miks seda tehakse? Üldiselt sellel saidil navigeerimise hõlbustamiseks ().

Kasutatakse nn silte märksõnad, mille komplekt iseloomustab lühidalt väljaannet (näiteks minu ajaveebi avalehele sobiks järgmine märgendite komplekt: veebisaidi loomine; reklaamimine; veebisaidi reklaamimine; tulu).

Nende sõnade abil saate selgelt kindlaks teha, millest see artikkel rääkis. Kuid nende peamine väärtus pole mitte see, vaid asjaolu, et külastaja saab klõpsata mis tahes sildil ja vaadata kõigi selle saidi artiklite loendit, kus see ilmus. Põhimõtteliselt on see võimas tööriist teabe klassifitseerimiseks.

Et mitte otsida artiklite alt vajalikke silte, loovad veebilehtede omanikud väga sageli nn sildipilv, mille saab paigutada saidi vasakusse või paremasse veergu või selle jalusesse (all). See häbi võib praktikas välja näha järgmine:

Tavaliselt loetletakse kõige populaarsemad sildid ja kõiki silte saate vaadata, klõpsates vastaval lingil. Mõnikord kuvatakse sagedamini kasutatavaid silte (neid on sellel saidil rohkemates artiklites) suurema kirjaga ja harvemini kasutatavaid silte väiksemas kirjas.

Mõnikord luuakse nende kuvamiseks eraldi leht, nagu on näidatud eelmisel ekraanipildil.

Miks see nii on märgistusmeetod siltide abil ei kasutata kõigil veebisaitidel, kui see on kasutajasõbralik? Neid pole ka minu blogis, mille kohta on mitmeid selgitusi. Kuigi nende kasutamine on vaikimisi ette nähtud, on märgenditega töötamiseks ka palju pluginaid.

Jah, sildid töötavad suurepäraselt, kui teil on vähe artikleid ja mäletate hästi kõiki silte, mille olete juba loonud ja teistes artiklites kasutanud. Kuid materjalide arvu suurenemisega suureneb siltide arv järsult, kui kasutatakse lähedase tähendusega märksõnu.

Sellest tekib tohutu segadus, mille väärtus navigeerimise parandamise mõttes on minu meelest üsna kaheldav. Sel eesmärgil on suure veebiprojekti puhul parem kasutada saidiotsingut. Kuigi sildid toimivad hästi sotsiaalvõrgustikes, kus saate siltide abil erinevatelt kasutajatelt saadud teavet kombineerida ja ühes kohas vaadata. .

Mis on HTML-sildid?

Otsustasin neid esimest korda uurida viisteist aastat tagasi, kuid siis ei jõudnud ma tiitlisildist kaugemale. Siis sattusin Evgeniy Popovi tasuta videokursusele HTML-is ja asjad läksid hästi. Muidugi oli see kursus alles algetapp, kuid just sellest lihtsast esitlusest algajatel sageli puudu jääb.

Need õppetunnid hõlmavad põhimärgendeid, mille abil saate hõlpsasti luua tabeleid, lisada teksti pilte ja hüperlinke, lisada saidile erinevaid vorme ja palju muud. Kokku 33 tasuta videot HTML-i teemadel.

Kuid videokursus on videokursus ja ma pean teid huvitama, et te selle alla laadiksite ja vaataksite. Üldistest fraasidest ei saa aru, millised sildid on HTML-keeles ja miks on vaja neid uurida. Oh, see on suurepärane ja lihtne asi, mis võimaldab teil saada oma veebisaidi meistriks. Miks vajate veebisaiti?

No ilmselt esiteks eneseväljenduseks ja pingutuseks ning teiseks - . Lihtsalt olge vait, muidu kuulevad kõik ja jooksevad uurima, mis on sildid, tegema veebisaite ja teenima kõike, mida ainult teie saaksite teenida, ja mina olen seltskonnas. Seetõttu räägin ma ka edaspidi eranditult sosinal.

Internetti võib võrrelda televisiooniga, kus teed oma väikese programmi (lood siltide abil kodulehe) ja saad reklaamist tulu. Mida populaarsem on teie saade (Interneti-projekt), seda rohkem teenite. Ülempiiri pole, kuigi pole ka alumist piiri. Kuid te ei pea investeerima raha, vaid lihtsalt oma tööd ja aega, mis kulub siltide uurimiseks, mootori tööpõhimõtteks ja tegelikult saidi sisuga täitmiseks.

Seega on sildid veebilehe lihtsaimad märgistuselemendid, et brauser saaks seda serverist laadides täpselt aru, kuidas konkreetset elementi (tekst, pilt, video) kuvada. Varem vastutas kogu selle asja eest ainult HTML-keel, kuid siis tulid nad talle appi ja tal läks palju lihtsamaks. Popovil on nende kohta ka tasuta videokursus, mida saate teha laadige alla siit .

Poisid, kui õpite HTML-silte, saate aru, et see oli sama lihtne kui pirnide koorimine. Kõige tähtsam on alustada ja ennast kuidagi stimuleerida. Ma ei räägi teile ainult rahalisest küljest. Saidist võib saada teie peamine sissetulekuallikas ja kogu pere saab sellest toituda. Teil on vaja õnne, sihikindlust ja mitte karta uusi asju proovida.

Sildid on erinevad, kuid neid pole palju (neist, mis jäid aktuaalseks pärast CSS-i kasutuselevõttu). Vaata, kui lihtne see on. Oletame, et soovite luua lõigu – ümbritsete lihtsalt tulevase lõigu teksti algus- ja sulgemismärgenditega P (see on ladina täht ja koodis on parem kirjutada see väikeseks, kuid siin tegin selle suureks selgus). See näeb välja selline:

Teksti tekst...... teksti tekst

Kas saate aru, mis vahe on avaval HTML-sildil (alguses) ja sulgeval (lõpus)? Noh, loomulikult lisasin kolmnurksulgu järele kaldkriipsu.

Oh, ma unustasin öelda Milliste kriteeriumide alusel eraldab brauser sildid?(märgistus) põhisisust. Kas arvasite ise?

See on õige, see on kolmnurksulud, millesse me need lisame. Brauser nägi veebilehe koodi sõelumisel sellist sulgu ja mõistis, et see on silt, ning töötleb kõike selles sisalduvat teatud algoritmi järgi (tee lõigud kõrguse vahedega, suurendab pealkirjade fonti jne). .

Kui peate tekstis kasutama kolmnurksulgu, tehke seda kindlasti nii, et brauser saaks teid õigesti mõista. Seda tuleb meeles pidada.

Koodis võivad need välja näha näiteks järgmiselt:

Tegelikult sisaldavad need selle veebilehe kirjeldust ja märksõnu, mille jaoks nad on registreeritud. Lisateavet nende kohta leiate ülaltoodud artiklist.

Metasildid kirjutatakse veebilehe koodisse rangelt määratletud kohta. Kas teate, milline? Täpselt nii, dokumendi nn peas, mis koosneb avamisest ja sulgemisest HEAD sildid.

Midagi nende sisse kirjutatud (sh META sildid) ei kuvata veebilehel. See on rangelt omandiõigusega kaitstud teave. Ülaltoodud kirjeldus ja märksõnad räägivad otsingumootoritele antud veebilehe sisust ja allolevast metasildist.

Mis on muusikasildid helifailides?

Autos või pleieris (telefonis) muusikat mängides märkasite ilmselt rohkem kui korra, et loo pealkirja ja autori-esineja nime asemel kuvati mingit jubedat jaburat. Võib eeldada, et allalaaditud muusikafailide nimed on kirjutatud vales venekeelses kodeeringus.

Kui nimetate faile ümber kasutades , näete oma pleieril ikkagi ebameeldivat pilti. Mida teha? Ja kes on selles olukorras süüdi? Kummalisel kombel, aga põhjused on valed selles muusikafailis ettenähtud sildid.

Need on õmmeldud otse helifaili (selle alguses või lõpus) ​​ja võivad sisaldada teavet kompositsiooni, selle autori, albumi, loo kestuse ja muu mitte nii olulise kohta. Muusikasiltide uusimates kehastustes saab neisse õmmelda isegi CD kaante kujutisi (tavaliselt on see katk).

Kuid probleem tekib reeglina mitte nende kättesaadavuses, vaid hankimises võimalus neid redigeerida. Iga endast lugupidava melomaani elus tuleb hetk, mil ta on "valmis rebima ja viskama", lihtsalt selleks, et oma kollektsioonis asjad korda seada ja kõikidele lugudele, mis on igas seadmes loetavad, õiged sildid lisada. Kuidas seda teha?

Spetsiaalse tarkvara kasutamine. Sildid ise ilmusid helifailides esimest korda eelmise sajandi lõpus. MP3-failide puhul nimetati nende lisamise standardiks ID3 ja muusikafailide puhul, mis on tihendatud ilma kvaliteeti kaotamata (näiteks FLAC jms), sai siltide (metaandmete) lisamise standard nimeks Vorbis comment.

Windowsi WMA-vormingus salvestatud muusika jaoks on WM-i metaandmed ja Apple MP4 jaoks iTunesi metaandmed (muide, ma kirjutasin sellest hiljuti).

Seega saate silte redigeerida spetsiaalsete programmide abil. Kõige populaarsem neist on ilmselt Mp3 tag(ametlik sait, kuid olge allalaadimisel ettevaatlik – ärge klõpsake kogemata reklaamil, mis pakub allalaadimiseks midagi täiesti erinevat). Arvan, et leiate kõik teised programmid ise, eriti kuna see on selle ülesande täitmiseks täiesti piisav.

Nii osutusid mitmekesisteks sildid, mis kõigil neil juhtudel täitsid oma peamist rolli – märgistamist (veebisaidi artiklite, veebilehe sisu või muusikafailide metaandmete kohta). Loodan, et nüüd on teil selle teema kohta vähem küsimusi.

Edu teile! Kohtumiseni ajaveebisaidi lehtedel

Rohkem videoid saate vaadata, minnes aadressile
");">

Võib-olla olete huvitatud

Instagrami sildid – miks neid vaja on ja kust kõige populaarsemaid näha
Hashtagid – mis need on ja kuidas hashtage Twitteris, Instagramis ja mujal kasutatakse Kuidas lisada oma WordPressi ajaveebi img-siltidele automaatselt alternatiivset atribuuti (kui neil neid pole)
Link - mis see on ja kuidas seda luua
Radikal – tasuta fotomajutus koos kiire ja lihtsa fotode üleslaadimisega Radikal.ru kaudu

Tere päevast, sõbrad! Täna on meil veel üks artikkel, mis on pühendatud ühele minu saidi kategooriale "HTML-juhend algajatele". Tõenäoliselt oli vaja alustada selle kategooria täitmist, kirjutades artiklist, mis on HTML, või sellest postitusest, mis selgitab üksikasjalikult, mis on html-sildid. Kuid juhtub nii, et selles olen juba avaldanud mitmeid kasulikke materjale, näiteks selle kohta, kuidas HTML-i abil rida teha või kuidas raami teha. Noh, okei, ma loodan, et minu viga ei sundinud teid otsima teavet muude allikate hulgast.

Siltide mõistmiseks tuletagem esmalt meelde, mis on HTML? Niisiis HTML on ingliskeelne lühend, mis tähistab - hüperteksti märgistuskeel. See on standardkeel, mida tõlgendavad kõik kaasaegsed brauserid ja mis vastutab lehe struktuuri ja sisu eest. Just HTML-i abil saab määrata, kuidas internetilehel kuvatav tekst, joonis või animatsioon välja näeb, samuti määrata selle asukohta, suurust jne. Esitatud märgistuskeel sisaldab html-silte, mis on selle aluseks.

Sildid– konkreetne nimega silt, mis koosneb nurksulgudes olevatest ladina tähestiku tähemärkidest (näiteks ). Silt on HTML-dokumendi põhielement. Need tuleb täita väiketähtedega, st selle asemel < PEALKIRI> peab olema < pealkiri> .

html-märgendite tüübid

Silte on kahte tüüpi − vallaline Ja kahekohalised(konteinerid). Viimased on levinumad. Kõik, mis avamise vahele jääb<>ja sulgev siltnimetatakse konteineri sisuks. Nagu näha, tuleb sulgemissildi sisse panna kaldkriips, st. kaldkriips "/" vahetult pärast esimest nurksulgu. Siltide mõju laieneb nende vahel sisalduvale teabele.

Üksikud sildid (sildid), nagu võite arvata, koosneb ühest html-elemendist - avamärgendist (näiteks ).

Sõltumata tüübist iga silt koosneb järgmistest elementidest:

Avamisnurkklamber ( < ).

Sildi nimi ( lk, keha, br).

Sulgemisnurkklamber ( > ).

Kasutatava sildi võimaluste laiendamiseks kasutatakse erinevaid atribuute ja atribuutide väärtusi, mis on eraldatud tühikuga. Atribuudid saab omakorda jagada kohustuslikeks ja valikulisteks.

Põhilised html-sildid

Standardiseeritud hüperteksti märgistuskeel sisaldab mitmeid sageli kasutatavaid HTML-märgendeid. Vaatame neist kõige olulisemat.

Põhilised seotud html-sildid

- < html> - ütleb brauserile, et selle ees on HTML-dokument.

- < pea> - sisaldab Interneti-lehe kirjeldust ja on omamoodi konteiner HTML-dokumendi kõigi päiseelementide jaoks, mille eesmärk on aidata brauseritel ja otsingumootoritel andmetega töötada.

- < keha> - määratleb dokumendi nähtava osa.

- </b>- vastutab dokumendi kuvamise ja pealkirja eest.</p> <p>- <b>< </b><b>laud</b><b>>, < </b><b>tbody</b><b>>, < </b><b>thead</b><b>>, < </b><b>td</b><b>>, < </b><b>th</b><b>> ja< </b><b>tr</b><b>> - </b> tabeli loomisega seotud sildid.</p> <p>- <b><p> </b>- selle sildi sulgemine ütleb brauseritele, et tekst kuvatakse uuel real, st uuel lõigul.</p> <p>- <b><h> </b>- määrab pealkirja ( <b>h1</b>…<b>h6</b>).</p> <p>- <b><br> </b>- silt, mis määrab selle asukohas reavahetuse.</p> <p>- <b><b>, <u>, <i> </b>- iga silt tõstab teksti eraldi esile paksus, allakriipsutatud või kaldkirjas.</p> <p>- <b><ol>, <ul>, <dl> </b>- eest vastutavad sildid.</p> <p>- <b><tt>, <kbd> </b>- efekt tekstile, mis jäljendab kirjutusmasina stiili.</p> <p>- <b><strong> </b>- veel üks HTML-märgend, mis muudab teksti paksuks. Erinevalt sildist <b>on otsingumootorite poolt eriti esile tõstetud.</p> <p>- <b><marquee> </b>- märgi loomiseks kasutatav silt.</p> <p>- <b><font> </b>- silt, mida kasutatakse teksti vormindamiseks, kuid mis töötab ainult spetsiaalsete atribuutide kasutamisel.</p> <p>- <b><a> </b>- väga levinud silt, mis vastutab hüperlingi loomise eest.</p> <p>- <b><cite> </b>- tsitaat.</p> <p>- <b><code> </b>- kuvab koodinäiteid HTML-dokumendis.</p> <p>- <b><q> </b>- vastutab sulgudes oleva teksti kuvamise eest.</p> <p>- <b><blockqote> </b>- loob taande mõlemale tekstipoolele.</p> <h3>Põhilised üksikud sildid</h3> <p>- <b><meta> </b>- otsingumootoritele mõeldud metateavet sisaldav silt. Selle sees saate sobivate atribuutide abil määrata märksõnu, indekseerimisprotsessi juhtimist, autori nime, dokumendi kodeeringut jne.</p> <p>- <b><img> </b>- graafiliste elementide (piltide) kuvamise eest vastutav silt. Kasutatakse koos nõutava atribuudiga <img src='https://i0.wp.com//URL' loading=lazy loading=lazy>.</p> <p>- <b><style> </b> - указывает на таблицу стилей CSS. Данный тег задается в теге <b>< </b><b>head </b><b>> </b>. HTML документ может состоять из энного количества тегов <b><style> </b>, задающих странице стилистику в независимости от расположения ее содержимого.</p> <p>- <b>< </b><b>hr </b><b>> </b> - добавляет горизонтальную линию.</p> <p>Нажав сочетание клавиш <b>Ctrl </b><b>+ </b><b>U </b> можно заметить, что весь HTML-документ построен на использовании HTML тегов и атрибутов. Совсем не обязательно запоминать все существующие HTML теги. Для внесения корректировок на сайт достаточно запомнить те, что приведены выше.</p> <p>Надеюсь, статья оказалась для вас полезной, и теперь вы знаете, какие существуют виды тегов и что это вообще такое.</p> <p>Спасибо за внимание и до скорого на страницах Stimylrosta.</p> <p>Обнаружили в тексте грамматическую ошибку? Пожалуйста, сообщите об этом администратору: выделите текст и нажмите сочетание горячих клавиш <b>Ctrl+Enter </b></p> <p>В языке HTML всё, что вы напишите в HTML-документе, будет выведено на экран браузера сплошным текстом, то есть браузер игнорирует переводы строк, а также несколько набранных вами подряд пробелов заменяются одним.</p> <p>Теги — это управляющие команды, которые были придуманы для того, чтобы отформатировать текст, т.е. теги говорят браузеру о том, как именно нужно вывести на экран часть текста, заключенную в теги. Для создания тега между угловыми скобками вводится HTML-код, который предназначен только для браузеров. Посетители сайта не видят теги.</p> <p>Как уже отмечалось выше, все теги начинаются с угловой скобки < и заканчиваются угловой скобкой > . После открывающей угловой скобки следует имя тега (команды).</p> <p>Например, тег <b><em> </b> предназначен для акцентирования текста, браузеры отображают такой текст курсивным начертанием. Когда браузер обнаруживает этот тег, он переключается на форматирование курсивным шрифтом текста, следующего за тегом.</p> <p>Рассмотрим пример:</p><p>Этот текст обычный. <em><i> Этот текст курсивный. </i> </p><p>Тег <b><em> </b> называют начальным или открывающим тегом, что означает включение браузером определенной команды (в данном случае написание курсивным шрифтом). У большинства тегов есть пара в виде закрывающего тега, который отключает команду.</p> <p>Закрывающий тег выглядит так же, как начальный, но начинается с слэша. Итак, конечный тег для выделения курсивным шрифтом - <b></em> </b>.</p> <p>Рассмотрим пример:</p><p>Этот текст обычный. <em><i> Внимание! Курсив. </i> </em> Это снова обычный шрифт. </p><p>Как вы успели заметить, браузер последовательно анализирует HTML – документ в поисках команд (тегов) и применяет или отключает разные параметры форматирования текста. Браузер отформатированный текст (все, что не является тегом) отображает в своем окне.</p> <table class="notice example"><tr><th><i> </i> </th> <td> Процесс вставки тегов в обычный неформатированный текст называется разметкой HTML-документа, а теги - знаками разметки. При написании тегов не учитывается регистр букв, тег может быть прописан как строчными, так и прописными буквами, но всё же рекомендуется применение прописных букв. </td> </tr></table><p>Ниже приведены примеры основных тегов HTML, с объяснением их использования, а также примеры их применения в HTML-документе.</p> <h2>Заголовки</h2> <p>Существует специальный тег для указания заголовков в HTML. Есть 6 уровней заголовков в HTML, начиная от для наиболее важных объявлений, до для наименее важных.</p> <p>В основе языка HTML лежит понятие «тэг» (англ.: <i>tag </i>-ярлычок, этикетка). Тэги заключаются в угловые скобки (< >) и образуют пары – контейнеры (открывающий тэг и закрывающий). Например, контейнером HTML документа является пара тэгов <html> и </html>. В web-странице включены контейнеры, отвечающие за заголовок документа (голова) и содержат дополнительную информацию, а также контейнеры, отвечающие за само содержание документа (тело). Они представлены на рисунке.</p><p>Итак HTML документ заключается в контейнер <html></html>, заголовок в контейнер <head></head>, а содержание документа в контейнере <body><script type="text/javascript"> <!-- var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})() //--> </script><br> <br> </body>. Контейнер <title>, расположенный в заголовке (контейнере ) содержит текст, отображающийся в верхней строке окна браузера. В контейнер заголовка также могут быть добавлены тэги, содержащие кодировку, ключевые слова web-страницы, а также код для подключения файлов каскадных таблиц стилей CSS, языка программирования jаvascript, VBScript и т.д.

Пример простейшей HTML странички, содержащей только основные тэги:

Название страничкиСодержание простейшей странички

Результат работы указанного кода изображен на рисунке.

Как видно из примера текст «Содержание простейшей странички» отображается обычным текстом. Для того чтобы произвести форматирование этого текста, необходимо использовать специальные тэги. Пример использования тэгов форматирования представлен на рисунке.

Для изменения шрифта, его цвета и размера используется тэг с параметрами “face”, “color” и “size”. Например для того чтобы задать шрифт “arial” красного цвета и 14 размера необходимо написать следующий код:

Форматируемтекст

Для выделения абзаца в тексте используется тэг

В контейнер которого как правило помещается каждый абзац текста. Для создания заголовка используются тэги

,

,

,

,

,
.

Для формирования списков в теле документа используются контейнеры , и . Причем тэг

    формирует нурмерованный список, тэг