Si të konfiguroni telefonat inteligjentë dhe PC. Portali informativ
  • në shtëpi
  • Në kontakt me
  • Cilat janë etiketat dhe atributet HTML, vërtetuesi i W3C. Struktura dhe rregullat për shkrimin e etiketave

Cilat janë etiketat dhe atributet HTML, vërtetuesi i W3C. Struktura dhe rregullat për shkrimin e etiketave

24.06.2019 Në kontakt me
XML është për përdorim të përgjithshëm, karakteret nuk kufizohen në grupin e karaktereve 7-bit ASCII. Karakteret e lejuara në XML janë tre karakteret e kontrollit ASCII CO, të gjitha karakteret e rregullta të standardit ASCII dhe pothuajse të gjitha karakteret e tjera të Unicode.

Emrat.

Në XML, të gjithë emrat duhet të fillojnë me një shkronjë, nënvizim (_) ose dy pika (:) dhe të vazhdojnë vetëm me karaktere që janë të vlefshme për emrat, domethënë, ato mund të përmbajnë vetëm shkronja të përfshira në seksionin e shkronjave të Unicode, numra arabë, viza, shenjat e nënvizuara, pikat dhe dy pikat. Sidoqoftë, emrat nuk mund të fillojnë në asnjë rast me një varg xml. Emrat që fillojnë me këto karaktere janë të rezervuara për përdorim nga W3C. Duhet mbajtur mend se meqenëse shkronjat nuk kufizohen ekskluzivisht në karaktere ASCII, fjalët nga gjuha amtare mund të përdoren në emra.

Struktura e dokumentit XML.

Çdo dokument XML përbëhet nga pjesët e mëposhtme:

  • Prolog fakultativ.
  • Trupi i dokumentit.
  • Një epilog opsional pas pemës së artikullit.

Le të shqyrtojmë secilën nga pjesët në më shumë detaje.

Prolog i një dokumenti XML.

Dokumenti XML fillon me një prolog. Prologu ofron disa udhëzime për analizuesin dhe aplikacionet XML.

Prologu përbëhet nga disa pjesë:

  1. një Deklaratë XML opsionale që është e mbyllur midis karaktereve... Reklama përmban:
    • etiketa xml dhe numri i versionit (versioni) i specifikimit XML;
    • një tregues i kodimit të karaktereve (kodimit) në të cilin është shkruar dokumenti (sipas parazgjedhjes kodimi = "UTF-8");
    • një parametër i pavarur i cili mund të jetë "po" ose "jo" (si parazgjedhje i pavarur = "po"). Vlera "po" tregon se dokumenti përmban të gjitha deklaratat e elementeve të kërkuara dhe "jo" tregon se kërkohen DTD të jashtme.

    E gjithë kjo së bashku mund të duket kështu:

    .

    Është e rëndësishme të theksohet se në një deklaratë XML, kërkohet vetëm atributi version; të gjitha atributet e tjera mund të hiqen dhe për këtë arsye të marrin vlerat e tyre të paracaktuara. Duhet mbajtur mend gjithashtu se të gjitha këto atribute duhet të specifikohen vetëm në rendin e mësipërm.

  2. komentet.
  3. komandat e përpunimit.
  4. simbolet e hapësirës së bardhë.
  5. opsionale Deklarata e llojit të dokumentit, DTD (Deklarata e llojit të dokumentit) e cila është e mbyllur midis karakterevedhe mund të shtrijë linja të shumta. Kjo pjesë deklaron etiketat e përdorura në dokument, ose ofron një lidhje me skedarin në të cilin janë regjistruar njoftime të tilla.

Pas Deklarata e llojit të dokumentit komentet, komandat e përpunimit dhe simbolet e hapësirës së bardhë mund të pasojnë gjithashtu.

Meqenëse të gjitha këto pjesë janë fakultative, prologu mund të hiqet.

Trupi i dokumentit XML.

Trupi i një dokumenti përbëhet nga një ose më shumë elementë. Në një dokument XML të mirëformuar, elementët formojnë një pemë të thjeshtë hierarkike, në të cilën element rrënjë(elementi rrënjë) në të cilin janë futur të gjithë elementët e tjerë të dokumentit. XML imponon një kufizim jashtëzakonisht të rëndësishëm për elementët - ato duhet të jenë të futura siç duhet. Kjo e bën mjaft të lehtë futjen e një dokumenti XML në një tjetër pa prishur strukturën e dokumentit, ndërkohë që element rrënjë nëndokumenti bëhet thjesht një nga elementët e dokumentit në të cilin ai ndahet. Në këtë drejtim, ne përballemi me një kufizim tjetër, përkatësisht që emrat e elementeve duhet të jenë unikë brenda dokumentit, pasi në dokumentin e përfshirë emrat e njëjtë si në dokumentin që përmban mund të kenë një kuptim krejtësisht të ndryshëm. Për të zgjidhur problemin e përputhjes së emrave, është prezantuar koncepti i hapësirës së emrave.

Emri i elementit rrënjë konsiderohet emri i të gjithë dokumentit dhe tregohet në pjesën e dytë të prologut pas fjalës Doctype. Nëse përkufizimi DTD është brenda një dokumenti XML, atëherë ai vendoset në kllapa katrore pas emrit të elementit rrënjë:

Zakonisht, megjithatë, një DTD shkruhet për disa dokumente XML në të njëjtën kohë. Në këtë rast, është e përshtatshme ta shkruani atë veçmas nga dokumenti, dhe më pas në vend të kllapave katrore shkruhet një nga fjalët System ose Public, e ndjekur nga një adresë në formën e një URI (Uniform Resource Identifier) ​​i një skedar me një përkufizim DTD. Për të gjitha qëllimet praktike, një URI konsiderohet ekuivalenti i një URL, megjithëse në parim mund të jetë çdo emër unik. Një përkufizim DTD, për shembull, mund të duket kështu:

Hapësirat e emrave XML

Meqenëse dokumente të ndryshme XML mund të përmbajnë emra të njëjtë të etiketave dhe atributet e tyre, të cilat kanë kuptime krejtësisht të ndryshme, ju duhet të jeni në gjendje t'i dalloni ato disi. Për ta bërë këtë, emrat e etiketave dhe atributeve furnizohen me një parashtesë të shkurtër, e cila ndahet nga emri me dy pika. Prefiksi i emrit shoqërohet me një identifikues që përcakton hapësira e emrit(hapësira e emrit). Të gjithë emrat e etiketave dhe atributeve me parashtesa të lidhura me të njëjtin identifikues formojnë një hapësira e emrit në të cilat emrat duhet të jenë unikë. Prefiksi dhe identifikuesi i hapësirës së emrit përcaktohen nga atributi xmlns si më poshtë:

Në vijim, emrat e etiketave dhe atributeve që duam t'i referohemi hapësirës së emrave "http: // URI_namespace" janë të prefiksuara me ns, për shembull:

Novosibirsk.

Atributi xmlns mund të shfaqet në çdo element XML, jo vetëm në rrënjë. Parashtesa që ai përcakton mund të zbatohet për elementin në të cilin është shkruar atributi xmlns dhe për të gjithë elementët e mbivendosur. Për më tepër, hapësira të shumta emrash mund të përcaktohen në një element. Në elementet e mbivendosur hapësira e emrit mund të anashkalohet duke e lidhur parashtesën me një identifikues tjetër. Shfaqja e emrit të etiketës pa parashtesë në një dokument duke përdorur hapësira e emrit, do të thotë se emri i përket hapësirës së emrave të paracaktuar. Prefikset që fillojnë me karaktere xml në çdo rast janë të rezervuara për vetë XML.

Emri, së bashku me parashtesën, quhet emër i zgjeruar ose i kualifikuar. Pjesa e emrit e shkruar pas dy pikave quhet pjesa lokale e emrit.

Përshëndetje të dashur lexues të faqes së blogut! Në artikullin e fundit, ne kuptuam se çfarë është një lloj dokumenti dhe se si shfletuesit përcaktojnë gjuhën e përdorur duke përdorur. Etiketa u konsiderua, por vetë koncepti (termi) nuk ishte. Në këtë artikull do t'ju tregoj se çfarë është një etiketë, pse ju nevojitet dhe cilat etiketa janë atje. Siç thashë në artikullin e fundit të këtij titulli, ne do të krijojmë një faqe skedar, mbi të cilën do të eksperimentojmë, duke u mbështetur në njohuritë e marra. Por kjo është në fund të artikullit, por tani për tani le të merremi me etiketën HTML.

Çfarë është një etiketë HTML, llojet e etiketave HTML, shembuj të shkrimit

Etiketa HTML- përkthyer nga anglishtja etiketë - etiketë- Personazhet e mbyllur në kllapa këndore dhe janë elementë të gjuhës së shënjimit të hipertekstit (HTML). Simbolet mund të interpretohen në anglisht (i gjithë Interneti është ndërtuar mbi të). Etiketa duket si

Ky është një etiketë me tekst të theksuar. Etiketat janë tre llojesh:

  • Etiketa hapëse- tag në fillim. Në shembullin e mësipërm, etiketa është teksti hapës dhe qëndron përpara tekstit që dëshironi të zgjidhni.
  • Etiketa e fundit- tag në fund. Një tipar dallues është prerja "/" përpara karaktereve në kllapa këndore. Përsëri, le të shohim shembullin e diskutuar më lart. Etiketëështë ai mbyllës pas tekstit, i cili duhet theksuar me shkronja të zeza
  • Etiketa të vetme- etiketat që nuk kanë një etiketë fundore. Një shembull është
    Këtu është një shembull i një etikete hapëse dhe mbyllëse:

I gjithë ndërtimi, duke përfshirë tekstin, do të duket kështu:

Ky tekst do të jetë me shkronja të zeza

Dhe kjo është se si do të duket ky tekst kur shfletuesi ta përpunojë atë dhe ta japë atë për ne: Ky tekst do të theksohet me shkronja të zeza. Ekziston edhe një gjë e tillë si etiketat e kontejnerëve, por ky është vetëm një emër i përgjithshëm për etiketat e fillimit dhe të fundit. Siç shkrova më lart, përveç etiketave të kontejnerëve, ka edhe etiketa të vetme. Dallimi është se etiketat e tilla nuk kanë nevojë të mbyllen. Një shembull i mrekullueshëm dhe më i zakonshëm është etiketa e linjës së re.

Në thelb, etiketat e vetme përdoren për të futur disa elementë, të tillë si një imazh ose një tabelë.

Cilat janë atributet, rregullat drejtshkrimore dhe pse janë të nevojshme

Përveç etiketave, ekzistojnë edhe të ashtuquajturat atributet... Më saktësisht, jo përveç kësaj, por në etiketa. Duke përdorur atributet, mund të vendosni parametra shtesë për një etiketë. Atributetçdo etiketë ka të vetin, por në këtë temë do të eksperimentojmë me etiketën , e cila, në fakt, nuk bën asgjë të arsyeshme pa atribute.

Fonti- një etiketë kontejneri që përdoret për të formatuar tekstin. Me ndihmën e kësaj etikete, ju mund ta bëni tekstin të trashë dhe të ndryshoni madhësinë dhe distancën midis rreshtave - në përgjithësi, gjithçka që mund të bëhet me tekstin. Le të shohim një shembull me madhësinë e tekstit. Së pari, le ta mbështjellim tekstin në një etiketë Font.

Teksti

Tani pak për rregullat për shkrimin e atributeve. Atributet gjithmonë shkruhen në etiketën hapëse dhe pas karaktereve të vetë etiketës. Ju mund të shkruani disa atribute në një etiketë në çdo mënyrë. Ju mund t'i gjeni atributet në faqen e internetit të verifikuesit të W3C (për të cilën do të shkruaj më poshtë). Pra, këtu është një shembull i një etikete fonti me një atribut të madhësisë:

Teksti

Ky atribut në etiketën e shkronjave ndryshon madhësinë e tekstit të mbyllur në etiketa.
Nëse hapni kodin burimor të faqes, do të shihni se vendi ku ndodhet fjala e madhe "Text" duket si

Teksti

Tashmë e keni parë se si shkruhen atributet. Ato shkruhen edhe në etiketa të tjera: së pari, shkruajmë vetë atributin (në këtë rast, madhësinë), më pas vendosim "=" dhe mbyllim parametrin e atributit në thonjëza të dyfishta. Ju mund t'i gjeni të gjithë parametrat e atributeve në të njëjtën faqe interneti të Konsorciumit World Wide Web.

Çfarë është vërtetuesi i W3C, rregullat drejtshkrimore dhe lista e etiketave

Siç kam shkruar, ka shumë etiketa. Por ku mund t'i gjeni të gjitha? Për këtë qëllim ekziston Vleftësuesi i W3C W3C - Konsorciumi World Wide Web, dhe në Rusisht - Konsorciumi World Wide Web. Jo plotësisht e qartë, apo jo? Ky është vendi ku zhvillohen standardet e uebit - (gjuhët e shënjimit të hipertekstit janë ideja e tyre). Në krye të të gjithë konsorciumit është, i njohur nga artikulli i fundit, Tim Berners-Lee - krijuesi i HTML. Faqja e kësaj organizate është w3.org. Ju paralajmëroj, faqja është plotësisht në anglisht, kështu që rezervoni një fjalor ose përkthyes në shfletuesin tuaj. Nga rruga, Google për këtë faqe është 9, dhe - 37000 (kjo është e gjitha shumë, nëse dikush nuk e di).

Ne i kthehemi temës së artikullit. Ne jemi të interesuar për standardet e gjuhës HNTML 4.01. Ndiqni lidhjen HTML 4.01 Specifikimi, pas së cilës shohim skedën e elementeve në krye, klikoni mbi të. Kështu që faqja hapet me të gjitha etiketat. Këto etiketa u zhvilluan dhe u miratuan si standard nga një konsorcium. Gjithçka, përsëri, është në anglisht. Menjëherë pas fjalëve "Indeksi i elementeve" shohim legjendën (kuptimi i shkronjave në kolona):

Dhe menjëherë pas legjendës është një tabelë e vetë etiketave:

  • Në kolonën e parë - Emri- emri i vetë etiketës - çfarë duhet të jetë në kllapa këndore (< и >).
  • Kolona e dytë është Etiketa e fillimit- prania e një etikete hapëse. Në këtë kolonë mund të shihni shkronjën "O", që do të thotë "Opsionale", dhe në përkthim nga anglishtja - Opsionale. Kjo letër është e pranishme vetëm përballë etiketave , , dhe dhe do të thotë që ju mund të vendosni etiketën hapëse, ose nuk mund ta vendosni - shfletuesi do të bëjë gjithçka vetë.
  • Kolona e tretë është Etiketa e Fundit- prania e një etikete mbyllëse. Përballë kësaj etikete mund të shihni shkronjën "O" dhe shkronjën "F". Vlera e të parës nuk ka ndryshuar. Shkronja e dytë - "F" - fjalë për fjalë "e ndaluar" nga anglishtja - do të thotë që është e ndaluar të vendosësh etiketën e mbylljes, thjesht nuk ekziston. Për shembull, nuk ka asnjë etiketë, sepse nuk ka asgjë për të mbyllur në të.
  • e katërta - Bosh- do të thotë që etiketa është e vetme (bosh). Të gjitha etiketat përballë të cilave është shkronja "E" në këtë kolonë, ekziston edhe shkronja "F" në kolonën e mëparshme. Në fund të fundit, etiketat e vetme nuk kanë etiketa mbyllëse. Një shembull është e njëjta etiketë .
  • Kolona e pestë është Depr. ose I zhvlerësuar- nga anglishtja "nuk rekomandohet". Nëse kjo kolonë përmban shkronjën "D" (që do të thotë saktësisht e njëjta), atëherë kjo etiketë nuk rekomandohet për përdorim në HTML. Duke parë pak përpara, sot ne përdorim Cascading Style Sheets - CSS - për të stiluar tekstin dhe pamjen e të gjithë sitit dhe dokumentit HTML. Shkurt dhe thjesht, krijohet një skedar i vetëm në të cilin janë shkruar të gjithë parametrat e tekstit që mund të thirren nga atribute të caktuara të etiketës. Pra, ky funksion përdoret vetëm në sajte, sepse kur dërgoni lajme me postë ose në RSS, CSS nuk zbatohet. Dhe këtu të njëjtat etiketa vijnë në shpëtim. Shumica e këtyre etiketave, nga rruga, kanë të bëjnë me hartimin e tekstit ( dhe
    janë një shembull)
  • Kolona e gjashtë - DTD- mund të përmbajë ose një shkronjë "L" ose "F"... E para është "L" - DTD e lirshme- do të thotë që etiketa përballë së cilës qëndron kjo shkronjë mund të përdoret vetëm në llojin e dokumentit kalimtar (- Kalimtare, për të cilën kam shkruar në artikullin e mëparshëm). E dyta është "F" — Kompleti i kornizave DTD- do të thotë që etiketa mund të përdoret vetëm në një dokument të tillë si FRAMESET (- grup kornizash). Nëse letra mungon, atëherë etiketa mund të përdoret në të gjitha llojet e dokumenteve.
  • Dhe kolona e fundit, e shtatë - Përshkrim- një përshkrim i shkurtër i etiketës, përsëri në anglisht

Atributet mund të gjenden në të njëjtën faqe të specifikimit HTML 4.01, por në skedën "atribute". Ka shumë më tepër atribute sesa etiketa. Dhe përsëri do të shkruaj çdo gjë pikë për pikë.

  • Kolona e parë është Emri- si në rastin e etiketave - emri i atributit. Gjithçka është në anglisht, por me njohuri themelore mund të merrni me mend se çfarë bën ky apo ai atribut.
  • Kolona e dytë - Elemente të ndërlidhuraËshtë një listë e të gjitha etiketave që përdorin një atribut. Të gjitha etiketat janë të lidhura, kështu që ju mund të hidheni direkt në informacionin e etiketës.
  • Kolona e tretë - Lloji Janë të gjitha vlerat e mundshme për një atribut specifik. Për shembull, përballë atributit të madhësisë që kemi zgjedhur në etiketën Font është vlera CDATA. Do ta shikojmë më vonë, por me pak fjalë, është një grup i veçantë opsionesh përmasash (në këtë rast). Në fund të fundit, mund të shkruani si pikselë ashtu edhe përqindje.
  • Kolona e katërt - E paracaktuar- do të thotë nëse atributi kërkohet në një etiketë specifike. Për shembull, në etiketën Img, kërkohet atributi src, pasi ai tregon burimin nga i cili duhet marrë imazhi.
  • Kolonat 6, 7 dhe 8 nënkuptojnë njësoj si për etiketat.

Të gjitha sa më sipër zbatohen vetëm për versionin HTML 4.01. Ne do të flasim për HTML 5 në një artikull tjetër, dhe do të prekim edhe XHTML. Dhe tani, siç premtova, ne do të krijojmë një faqe HTML, mbi të cilën do të eksperimentojmë.

Krijo skedar html - dokument HTML

Para së gjithash, le të kuptojmë se çfarë është dokument HTML... Dhe ky është, në fakt, një skedar në formatin HTML. Dhe të gjitha faqet e internetit janë dokumente HTML. Për shembull, kur të shkoni te faqja në shiritin e adresave në fund, mund të shihni ".html" ose ".htm" pas adresës. Ne do të krijojmë një skedar me këtë shtesë. Në përgjithësi, nëse doni të eksperimentoni në sit, dhe jo në faqe, atëherë është më mirë të krijoni një server lokal - Denver (për të cilin dua të shkruaj gjithçka).

Duke marrë parasysh që as që fola për etiketat e pranishme në secilën faqe, ne thjesht do të krijojmë një skedar me çdo emër dhe shtesë .html. Është e mundur (dhe më e mira nga të gjitha) për t'u përdorur Notepad ++, sepse ky redaktues teksti përdor theksimin e kodit, i cili është shumë i përshtatshëm kur redaktoni kodin dhe mund të ruani skedarë në shumë formate. Ekzistojnë gjithashtu programe në të cilat, kur shtypni kodin, rezultati shfaqet menjëherë në formën e përpunuar.

Pra, ne vetëm duhet të hapemi Notepad ++ dhe ruani një skedar me tekst të lirë (mund ta zbrazni gjithashtu), por në formatin .html. Për ta bërë këtë, si zakonisht, klikoni në etiketën e skedarit, më pas "ruani si" dhe kërkoni në listën e madhe të shtesave Skedari i gjuhës së shënjimit të HyperText(zgjatjet e skedarit) ". Kjo, në fakt, është e gjitha. Ne do t'i shtojmë rreshtat e parë këtij skedari në artikullin tjetër nga titulli "Krijimi i një faqe interneti nga e para"

Etiketëështë një fjalë e veçantë e rezervuar e mbyllur në kllapa këndore (për shembull, ). Etiketa është përbërësi kryesor i HTML: kodi fillon me të, përfundon me të dhe informacioni i shfaqur në faqen e internetit gjendet brenda etiketave. Rekomandohet t'i shkruani ato me shkronja të vogla, domethënë me shkronja të vogla të zakonshme: jo , a .

Çfarë janë etiketat?

Shumica e etiketave HTML janë çiftuar: ekziston një hapëse (për shembull, ) dhe një etiketë mbyllëse, e cila dallohet nga etiketa hapëse me një të pjerrët ( / ) pas kllapës së parë këndore (për shembull, ). Çdo gjë që është brenda një palë etiketash quhet e tyre përmbajtjen.

<Открывающий_тег>përmbajtja Teksti i vendosur brenda këtyre etiketave bëhet i theksuar

Ekzistojnë gjithashtu etiketa të paçiftuara (të vetme), të cilat thirren etiketa... Ata, ndryshe nga etiketat e çiftuara, nuk kanë nevojë të mbyllen, sepse nuk punojnë me përmbajtjen, por kryejnë një funksion më vete. Një shembull i një etikete të vetme është -
... Ai vendos që teksti të përfundojë në rreshtin tjetër.

Nëse tërheqim paralele me gjuhën ruse, atëherë mund të themi se etiketat e çiftuara janë thonjëza ose kllapa që ndikojnë në vetitë e tekstit të mbyllur në to (përpiquni të mos mbyllni thonjëzat në kohë), dhe etiketat e vetme (etiketat) janë shenja pikësimi (pasthirrmë, pyetje ose pikë).

Çdo etiketë përbëhet nga:

  • Kllapa këndore e hapjes ( < ).
  • Fjalë e veçantë (emri i etiketës). Për shembull, orë, iframe,b.
  • Kllapa këndore e mbylljes ( > ).

Etiketat bazë HTML

Meqenëse etiketat janë zemra e një gjuhe markup, nuk është për t'u habitur që ka mjaft prej tyre. Le të shqyrtojmë etiketat kryesore, më të rëndësishme.

  • - një etiketë e vetme, brenda së cilës vendoset komenti. Një komentështë tekst që nuk është dhënë nga shfletuesi. Mund të shkruani çdo gjë brenda etiketës, madje edhe etiketa të tjera - ato nuk do të funksionojnë, nuk do të shfaqen në ekran. Zhvilluesit komentojnë kodin ose për ta bërë më të lehtë për webmasterët e tjerë që ta kuptojnë atë, ose në mënyrë që pas një kohe të gjatë ata ta kuptojnë shpejt atë vetë.
  • , , , , </b>- etiketat që duhet të jenë të pranishme në çdo dokument të mirëfilltë HTML (për më shumë detaje shihni "Si të krijoni një faqe interneti në Notepad").</li> <li><b><meta> </b>- etiketa përmban informacione ndihmëse për shfletuesit dhe motorët e kërkimit. Brenda tij, mund të shkruani fjalë kyçe, përshkrimin e faqes, kodimin e dokumentit, emrin e autorit, etj.</li> <li><b><script> </b> содержит ссылку на файл сценария или сам код.</li> <li><b><style> </b> - тег, задающий стиль документа и/или его элементов с помощью CSS. HTML-документ может содержать множество тегов <b><style> </b>, определяющих разные стили разных частей страницы.</li> <li><b><header> </b> - полная противоположность <b><footer> </b>, его дополняющая. Тег задаёт «шапку» (заголовок) раздела или всей страницы.</li> <li><b><footer> </b> хранит в себе «ноги» сайта или раздела. Внутри него можно разместить вспомогательную информацию, копирайт, контактные данные и т. д.</li> <li><b><main> </b> содержит основной контент страницы. Ни шапку, ни блок меню, ни «ноги» сайта, а то, ради чего страница создавалась. Например, на странице, которую вы сейчас читаете, внутри <b><main> </b> должна располагаться как раз эта статья.</li> <li><b><a> </b> предназначен для создания ссылок. Ссылки - корень гипертекста, поэтому им посвящена .</li> <li><b><img> </b> нужен для добавления на веб-страницу картинок (к вашим услугам посвящённая этому действу ).</li> <li><b><blockquote> </b>, <b><br> </b>, <b><hi1>-<hi6> </b>, <b><hr> </b>, <b><i> </b>, <b><p> </b>, <b><s> </b>, <b><strong> </b>, <b><ins> </b> и другие теги форматирования текста составляют большую группу HTML-тегов, о них рассказывает статья «Форматирование текста в HTML» .</li> <li><b><div> </b> - блочный элемент. Текст внутри <b><div></div> </b> форматируется с помощью CSS (каскадных таблиц стилей, которым посвящена вторая часть самоучителя).</li> <li><b><span> </b>. У вас есть абзац <b><p> </b> или блок <b><div> </b>. Текст в нём оформлен в едином стиле, но вы бы хотели, не нарушая структуры, сделать так, чтобы несколько слов имели другой размер шрифта или цвет. Именно для таких ситуаций и предназначен тег <span>.</li> <li><b><ol> </b>, <b><ul> </b>, <b><li> </b> - теги списков. Маркированные, нумерованные - работа этих тегов. Есть ещё списки определений, за которые отвечают теги <b><dd> </b>, <b><dt> </b> и <b><dl> </b>, но подробно обо всей это шестёрке вы узнаете из статьи «Создание списков» .</li> <li><b><table> </b>, <b><tbody> </b>, <b><thead> </b>, <b><td> </b>, <b><th> </b> и <b><tr> </b> используются при создании таблиц и подробно рассматриваются в отдельной статье .</li> <li><b><form> </b> - тег, добавляющий странице интерактивности, то есть позволяющий пользователю взаимодействовать с веб-сайтом. Конечно, форме необходим обработчик, но зато с помощью тегов внутри <b><form></form> </b> вы можете создать интерфейс. Флажки, кнопки, переключатели, поля ввода и другие объекты, которые требуют от вас активных действий - всё это элементы формы, код которых размещается внутри контейнера <b><form> </b>.</li> <li><b><button> </b> - тег, создающий интерактивную кнопку. Чтобы при нажатии на неё что-нибудь произошло, кнопка должна находиться в форме (располагаться между тегами <b><form></form> </b>).</li> <li><b><input> </b> создаёт элементы формы: переключатели, флажки, кнопки, всевозможные поля ввода. Вставляется в контейнер <b><form> </b>. Но зачем нам тогда отдельно <b><button> </b>, если есть универсальный <b><input> </b>? <b><button> </b> позволяет создать кнопку с расширенными параметрами. Например, на кнопке <button> можно разместить картинку. На элементе, созданном через <b><input> </b>, такого сделать нельзя.</li> <li><b><menu> </b> и <b><command> </b> - теги создания меню в HTML 5. <b><menu> </b> - это контейнер, внутри которого помещаются элементы <b><command> </b>, добавление которых и приводит к созданию пунктов меню. Довольно интересная парочка. Например, с её помощью вы можете создать собственное контекстное меню для страницы или отдельного её элемента.</li> <li><b><textarea> </b> - ещё один тег формы, создающий в ней большое поле, в которое можно вводить не одну строку текста, а целые абзацы.</li> </ul> <p>Программист сталкивается с рядом проблем при написании HTML тегов. При работе над большим сайтом программный код разрастается, и вести контроль становится проблематично, программист может не закрыть тег и верстка сайта «уедет» — блок налезает на другой и внешний вид сайта портится.</p> <i> </i><p>Блочная верстка — ад программиста</p><br> На крупном сайте следить за тегами проблематично, особенно если над его разработкой работают несколько программистов. Основатели HTML предупреждают программистов и призывают соблюдать стандарты. Небольшие ошибки в коде нормальны и легко исправимы. Рассмотрим способы проверки HTML кода на ошибки и <b>выявление незакрытых тегов и других элементов </b>. <h2>Определение незакрытых тегов</h2> <p>Как проверить код на незакрытые дивы (<div> ), табличные элементы (<table> / <tr> / <td> ) и другие теги? Простейший способ — текстовый редактор с подсветкой синтаксиса. Скачайте notepad++ поддерживающий десятки языков программирования. Нужные для веб-кодинга HTML, JavsScript, PHP и другие языки он подсвечивает.</p> <p>Проверить обычные HTML элементы не сложно, и если незакрытые теги вставки гиперссылки «<a> » теги форматирования «<b> » / «<h1> » или «<noindex> » можно определить визуально, то с блочными элементами вроде дивов и таблиц это не сработает. Код большой, один див является оберткой другого, при большой вложенности можно перепутать и случайно удалить один элемент и верстка поедет.<br></p><p><img src='https://i1.wp.com/moredez.ru/wp-content/uploads/2017/09/%D0%A0%D0%B5%D0%B4%D0%B0%D0%BA%D1%82%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5-%D0%BA%D0%BE%D0%B4%D0%B0-html-%D1%81-%D0%BF%D0%BE%D0%B4%D1%81%D0%B2%D0%B5%D1%82%D0%BA%D0%BE%D0%B9-%D1%81%D0%B8%D0%BD%D1%82%D0%B0%D0%BA%D1%81%D0%B8%D1%81%D0%B0-%D1%87%D0%B5%D1%80%D0%B5%D0%B7-notepad.png' width="100%" loading=lazy loading=lazy></p><br><b>Что бы определить незакрытый тег (html элемент страницы) включаем подсветку в notepad++ </b> <ol><li>1. В меню выбираем «Синтаксис»</li> <li>2. Выбираем нужный язык, в нашем случае HTML</li> <li>3. Номер строки</li> <li>4. Древовидная полоса, позволяющая просматривать внутренности тегов</li> </ol><p>Проверка заключается в закрытии одного дива за другим нажатием на плюсики «+», если тег не закрывается, значит, закрывающегося тега нет. Исследуем код и прописываем недостающий в нужно месте.</p> <p>Определить к какому закрывающемуся тегу относится элемент можно нажатием в редакторе на этот тег. Редактор подсветит открывающейся и относящийся к нему закрывающейся тег. Можно определить ошибку при просмотре, когда закрывающегося элемента не обнаруживается, или он относится к другому элементу, который рушит логику кода.</p> <p>Это простейший способ проверки, требующий ручной работы. Автоматизированных систем нет, только программист может понять, где нужно прописать закрытие дива или таблицы, не нарушив визуального оформления страницы.<br></p><p><img src='https://i2.wp.com/moredez.ru/wp-content/uploads/2017/09/%D0%9F%D1%80%D0%BE%D1%81%D0%BC%D0%BE%D1%82%D1%80-%D0%B8-%D1%80%D0%B5%D0%B4%D0%B0%D0%BA%D1%82%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5-%D0%B8%D1%81%D1%85%D0%BE%D0%B4%D0%BD%D0%BE%D0%B3%D0%BE-%D0%BA%D0%BE%D0%B4%D0%B0-%D0%B2-%D0%B1%D1%80%D0%B0%D1%83%D0%B7%D0%B5%D1%80%D0%B5.png' width="100%" loading=lazy loading=lazy></p><br> Используйте встроенные отладчики FireBug (FireFox) и инспекторы-исследователи встроенные в браузер. Открыть отладчик (редактор) кода в Opera можно нажатием комбинации «Ctrl-Shift-C» или как показано на рисунке. Правой кнопкой мыши жмем на исследуемом объекте и в контекстом меню жмем «Просмотреть код элемента».<h2>Валидатор HTML: Общий анализ и поиск ошибок в коде</h2> <p>Проверить код на ошибки можно валидатором HTML — W3C.</p> <p>Markup Validation Service (MVS) — Этот валидатор проверяет правильность разметки веб-документов в HTML, XHTML, SMIL, MathML и т.д. Если вы хотите проверить конкретный контент, такой как RSS / Atom-каналы или таблицы стилей CSS, содержимое MobileOK или найти неработающие ссылки, есть другие валидаторы и доступные инструменты. В качестве альтернативы можете попробовать наш валидатор на основе не DTD.</p> <p><img src='https://i2.wp.com/moredez.ru/wp-content/uploads/2017/09/%D0%9F%D1%80%D0%BE%D0%B2%D0%B5%D1%80%D0%BA%D0%B0-%D0%BD%D0%B5%D0%B7%D0%B0%D0%BA%D1%80%D1%8B%D1%82%D1%8B%D1%85-%D1%82%D0%B5%D0%B3%D0%BE%D0%B2-%D0%B8-%D0%B4%D1%80%D1%83%D0%B3%D0%B8%D1%85-%D0%BE%D1%88%D0%B8%D0%B1%D0%BE%D0%BA-%D0%BA%D0%BE%D0%B4%D0%B0-%D1%81%D1%82%D1%80%D0%B0%D0%BD%D0%B8%D1%86%D1%8B.png' width="100%" loading=lazy loading=lazy></p> <p>Сервис позволяет проверить CSS, HTML, XHTML, JS… после анализа сайта сервис выдаст ошибки и метод устранения проблемного участка кода.. Можно исправить, но не обязательно прислушиваться к сервису если ваш сайт нормально отображается и индексируется. Каждый 2 крупный сайт не до конца соблюдает стандарты HTML, проверьте сами.</p> <script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+ ";"+Math.random()+ "border='0' width='1' height='1' loading=lazy loading=lazy>");</script> </div> <div class="post-social-counters-block"> <div style="margin-top: 12px"> <noindex></noindex> </div> </div> </div> </div> <a name="comments"></a> <h3 class="best-theme-posts-title">Artikujt kryesorë të lidhur</h3> <div class="container-fluid"> <div class="best-theme-posts row"> <div class="theme-post col-sm-4"> <a href="https://bumotors.ru/sq/ispolzovanie-telefona-kak-veb-kamery-telefon-kak-veb-kamera-ob-etom.html"> <div class="img_container"><img src="/uploads/fc65d4ee176d62520b8bee0c5914c756.jpg" border="0" alt="Telefoni është si një kamerë në internet - shumë pak njerëz dinë për të!" width="320" height="180" / loading=lazy loading=lazy></div> <span class="theme-post-link">Telefoni është si një kamerë në internet - shumë pak njerëz dinë për të!</span> </a> </div> <div class="theme-post col-sm-4"> <a href="https://bumotors.ru/sq/samsung-galaksi-j5-chem-luchshe-obzor-samsung-galaxy-j5-2017-plyusy-i-minusy-otdelnyi-slot.html"> <div class="img_container"><img src="/uploads/e2d4c836061f4e01b13a154043125675.jpg" border="0" alt="Rishikimi i Samsung Galaxy J5 (2017): të mirat dhe të këqijat" width="320" height="180" / loading=lazy loading=lazy></div> <span class="theme-post-link">Rishikimi i Samsung Galaxy J5 (2017): të mirat dhe të këqijat</span> </a> </div> <div class="theme-post col-sm-4"> <a href="https://bumotors.ru/sq/kak-pomenyat-vremya-v-samsunge-s4-samsung-galaxy-s4-sovety-i-tryuki-raznye-versii.html"> <div class="img_container"><img src="/uploads/df065b1f0e0dbfba64d9188d40c7696c.jpg" border="0" alt="Samsung Galaxy S4: Këshilla dhe truke" width="320" height="180" / loading=lazy loading=lazy></div> <span class="theme-post-link">Samsung Galaxy S4: Këshilla dhe truke</span> </a> </div> </div> </div> </div> <a name="comments"></a> </div> <div class="right-column col-sm-4 col-md-4"> <div class="write"> <span class="tags-title">Kategoritë:</span> <ul style="height: 286px;" id="right-tags" data-tagscount="18" data-currentmaxtag="10" class="tags"> <li class=""><a href="https://bumotors.ru/sq/category/programs/">Programet</a></li> <li class=""><a href="https://bumotors.ru/sq/category/safety/">Siguria</a></li> <li class=""><a href="https://bumotors.ru/sq/category/windows-10/">Windows 10</a></li> <li class=""><a href="https://bumotors.ru/sq/category/iron/">Hekuri</a></li> <li class=""><a href="https://bumotors.ru/sq/category/windows-8/">Windows 8</a></li> <li class=""><a href="https://bumotors.ru/sq/category/vkontakte/">Në kontakt me</a></li> <li class=""><a href="https://bumotors.ru/sq/category/errors/">Gabimet</a></li> </ul> </div> <div class="banner"> </div> </div> </div> </div> <div style="clear:both"></div> </div> <div class="footer"> <div class="subscribe"> <div class="main-wrapper container"> <div class="row"> <div class="col-sm-8"> </div> <div class="col-sm-4"> <div class="social"> <a href="" class="vk social-ico"></a> <a href="https://facebook.com/" class="fb social-ico"></a> <a href="https://twitter.com/" class="tw social-ico"></a> </div> </div> </div> </div> </div> <div class="info"> <div class="main-wrapper container"> <div class="row"> <span class="footer-info col-xs-12">© 2021 bumotors.ru. Si të konfiguroni telefonat inteligjentë dhe PC. Portali informativ.</span> </div> </div> </div> </div> </body> </html>