8 mga HTML tag na kailangan mong gamitin (at 5 upang maiwasan)

May -Akda: John Stephens
Petsa Ng Paglikha: 2 Enero 2021
I -Update Ang Petsa: 19 Mayo 2024
Anonim
Ano ang Print Area at Paano ito i set?
Video.: Ano ang Print Area at Paano ito i set?

Nilalaman

Nang ipinakilala ang pagtutukoy ng HTML5, nagdala ito ng maraming bagong mga tag na semantiko, na nagbigay ng higit na kahulugan sa mga HTML tag. Mahusay na balita para sa mga taga-disenyo ng web, na hindi na kailangang gumawa ng mga swatch ng mga div> tag upang maitayo ang istraktura ng kanilang website.

Habang ang pangunahing semantiko mga tag ng HTML ay gusto header>, footer> at nav> ay nagpapaliwanag sa sarili, mayroong isang napakaraming mga mas bagong mga tag ng HTML na kailangang gamitin din ng mga taga-disenyo ng web. Sa post na ito, binubuo namin ang walong mahahalagang HTML tag na kailangan mong gamitin, at ipaliwanag kung paano ito gawin. Para sa balanse, pumili din kami ng limang mga tag na kailangang maalis sa hangganan ng kasaysayan ng web.

Para sa higit pang payo sa disenyo ng web, tingnan ang pag-ikot ng aming mga tool sa disenyo ng web, listahan ng mga nangungunang tagabuo ng website o aming gabay sa kung paano gumawa ng isang app.

01. larawan>

Ang larawan> ang tag ay katulad sa img>, ang larawan> Ang elemento ay nagbibigay ng kakayahang umangkop sa pamamagitan ng pagpapahintulot sa maramihang pinagmulan> mga elemento para sa parehong mapagkukunan, na maaaring umangkop batay sa isang query sa media o suporta sa uri ng imahe. Halimbawa, maaari itong magbigay ng mga imahe ng WebP sa mga browser na sumusuporta sa mas bago, mas maliit na sukat ng file.


02. datalist>

Ang datalist> nagbibigay ang tag ng isang autocomplete na interface para sa input> mga elemento. Naglalaman ang bawat listahan ng isang hanay ng pagpipilian> mga elemento na may kaugnay na halaga. Kapag na-link sa isang input> gamit ang katangiang "listahan", maaari itong magbigay ng isang drop-down na listahan o kahit na ipakita ang mga mungkahi bilang mga uri ng gumagamit.

03. dl>

Ang listahan ng paglalarawan na ito, o dl> tag, nagsisilbing isang lalagyan para sa mga pangkat ng mga tinukoy na termino. Sa loob, bawat term (dt>) at kahulugan (dd>) ay pinagsama-sama upang bumuo ng isang tulad-glossary na istraktura. Habang naglalapat ito ng pangunahing pag-format bilang default, nakikinabang ang mga nagbabasa ng screen ng semantiko at iba pang mga awtomatikong tool tulad ng mga crawler.

04. mga detalye>

Ang mga pagkakasundo ay isang pangkaraniwang pattern ng disenyo kapag maraming data ang kailangang ipakita nang sabay-sabay, tulad ng isang pahina ng mga katanungan. Sa pamamagitan ng paggamit ng mga detalye> elemento sa tabi buod>, makakamit natin ang parehong epekto nang walang JavaScript. Ang pag-click sa buod ay magpapalipat-lipat sa natitirang nilalaman.


05. dfn>

Ang mga kumplikadong termino o daglat ay madalas na nangangailangan ng pagtukoy para sa mga hindi pamilyar. Isang term na nakabalot sa a dfn> ang tag ay matutukoy ng teksto na pumapaligid dito. Ito ay isang elemento ng inline at idinisenyo upang magamit upang mai-highlight ang mga kahulugan sa wika ng tao.

06. pigura>

Ang isang pigura ay tinukoy bilang isang yunit ng nilalaman na madalas na lilitaw sa pangunahing daloy ng isang dokumento ngunit maaari ding maunawaan nang hiwalay. Ang pigura> ang sangkap ay bumabalot ng isang imahe o iba pang sanggunian na nilalaman at maaari ring isama ang isang paglalarawan ng mga nilalaman nito figcaption>.

07. code>

Sa pagsulat na panteknikal, maaaring maging kapaki-pakinabang na paghiwalayin ng biswal ang computer code mula sa natitirang pangungusap. Sa pamamagitan ng pagbabalot ng bawat paglitaw sa a code> tag, maaaring mag-apply ang browser ng ilang default na pag-format upang maipakita ito nang mas naaangkop. Pagsamahin sa pre> para sa mas malaking mga bloke ng code.


08. oras>

Maaari kaming magsulat ng mga halaga ng oras nang magkakaiba depende sa konteksto o sa wika. Sa pamamagitan ng pagmamarka ng mga halagang ito sa oras> ang tag, mga search engine at iba pang awtomatikong tooling ay maaaring mabilis na makuha ang impormasyong ito. Gamitin ang katangiang "datime" upang makapagbigay ng isang tukoy na oras sa isang mas format na madaling gamitin sa machine.

5 mga HTML na tag na maiiwasan

Ang pagtutukoy ng HTML ay may maraming mga legacy tag na maaari pa ring magamit, at gagana pa rin, ngunit ang simpleng katotohanan ay, karaniwang may isang mas mahusay na kahalili doon. At, kung mayroong isang mas mahusay na pagpipilian sa gayon kailangan mo talagang gamitin ito.

Mayroon ding isyu ng suporta sa browser. Ang ilang mga tag ay hindi na susuportahan sa bawat browser, ngunit maaaring mapansin ang mga ito kapag tinitingnan ang disenyo ng isang pahina. Muli ang mga ito ay kailangang mapalitan.

Sa ibaba makikita mo ang limang mga tag na tiyak na hindi nakaupo sa loob ng HTML ng anumang pahina. Kung nakita mo ang alinman sa mga ito sa iyong code siguraduhin na ang mga ito ay pinalitan ng isang mas angkop na tag o tinanggal nang sama-sama.

01. font>

Kasaysayan, ang font> ginamit ang tag upang mag-istilo ng isang bloke ng teksto, pinakamahusay na ngayong mag-target at mag-istilo ng teksto sa CSS. Ayon sa Advanced Web Ranking, halos 6.5 milyong mga website ang gumagamit pa rin ng tag sa kabila nito na hindi na ginagamit ng maraming taon.

02. menuitem>

Kapag pinagsama sa menu>, ang menuitem> magbibigay ang tag ng mga pagpipilian at pagkilos upang maisagawa sa loob ng mga menu ng konteksto. Inalis na ito mula sa detalye dahil hindi ito nakatanggap ng maraming suporta sa browser.

03. malaki>

Ang malaki> nadagdagan sana ng tag ang laki ng teksto sa loob ng tag ng isang antas. Ang kasama nito maliit> wasto pa rin ang HTML, ngunit ngayon ay may isang mas tinukoy na kahulugan ng semantiko na tumutukoy sa maliit na print.

04. gitna>

Dati ang gitna> ang tag ang nag-iisang paraan upang ma-sentralisahin ang parehong nilalaman ng block at inline, ngunit pinalitan na ito ng "text-align: gitna”Sa CSS, na gumaganap ng parehong trabaho.

05. marquee>

Ang marquee> pinayagan ng tag ang teksto sa loob ng tag na lumipat sa screen tulad ng isang ticker ng balita. Habang dati isang tanyag na tampok ng web na-uri ito bilang lipas na sa pabor ng mga animasyon na nakabatay sa CSS.

Upang mapatakbo ang iyong site ayon sa gusto mo, tiyaking nakuha mo ang tamang serbisyo sa web hosting para sa iyo. Nakakuha ng isang bungkos ng mga assets upang itago? Kailangan mo ng maaasahang cloud storage.

  • Mga tool sa disenyo ng web: upang matulungan kang gumana nang mas matalino
  • Mga tumutugong tutorial sa disenyo ng web: talagang kapaki-pakinabang na mapagkukunan
  • Mga laptop para sa programa: ang pinakamahusay na mga pagpipilian
Ang Pinaka-Pagbabasa
Paano Burahin ang iPad nang walang iCloud Password 2020 Nai-update
Matuklasan

Paano Burahin ang iPad nang walang iCloud Password 2020 Nai-update

Ang artikulong ito, gagabayan ka namin a kung paano makamit ang iPad nang walang paword a iCloud dahil maraming mga gumagamit ang hindi na matandaan ang pacode. a pamamagitan ng pag-reet ng factory a ...
How-to Tutorial: Pagsamahin ang Mail mula sa Excel patungo sa Word
Matuklasan

How-to Tutorial: Pagsamahin ang Mail mula sa Excel patungo sa Word

Ang pamamaraan a pag-merge ng mail mula a mga label ng Excel hanggang Word ay hindi iang kumplikado. Ngunit ang karamihan ng mga gumagamit ay walang kamalayan a pamamaraang ito. Ngunit huwag mag-alala...
Paano Tanggalin ang Administrator Account sa Windows 10
Matuklasan

Paano Tanggalin ang Administrator Account sa Windows 10

Kapag pinag-uuapan natin ang tungkol a Window Adminitrator account, ano ang naa iip mo? Kaya, pinamamahalaan nila ang buong ytem. Bago ka matuto kung paano tanggalin ang Adminitrator account na Window...