Ang gabay na ito ay nagpapakita kung ano ang isang HTML starter template.
Ano ang HTML Starter Template?
Ang isang HTML starter template ay naglalaman ng na deklarasyon, ang ,
, at na mga tag, at isang pangunahing hanay ng mga estilo ng CSS at JavaScript script. Ang mga tag na ito ay nagbibigay ng pundasyon para sa paglikha ng isang webpage na nakakatipid ng maraming oras at pagsisikap para sa mga developer.Ang HTML starter template ay lilitaw tulad nito:
< html lang = 'sa' >
< ulo >
< meta charset = 'UTF-8' >
< meta pangalan = 'viewport' nilalaman = 'width=device-width, initial-scale=1' >
< pamagat > Linux < / pamagat >
< link rel = 'stylesheet' href = './style.css' >
< meta http-equiv = 'X-UA-Compatible' nilalaman = 'ie=edge' >
< / ulo >
< katawan >
< h1 > Template ng Panimulang HTML < / h1 >
< / pangunahing>
< script src = 'index.js' >< / script >
< / katawan >
< / html >
Sundin ang demonstration sa ibaba upang makakuha ng kaalaman tungkol sa mga tag/element na available sa HTML starter template:
Ang Tag
Ang ' ” tag ay naglalaman ng data tungkol sa uri ng file at nagsasabi sa browser kung paano ito i-render. Malaki ang naitutulong ng tag na ito sa pag-optimize ng search engine sa pamamagitan ng pagbibigay ng impormasyon tungkol sa kung aling bersyon ng HTML ang ginagamit upang buuin ang webpage. Kung ang tag na ito ay nawawala sa isang HTML file, ang web browser ay maaaring kumilos nang hindi inaasahan o magpakita ng mga maling elemento.
Ang Tag
Ang ' Ang tag na ” ay isang kinakailangang elemento, at ito ay gumaganap bilang isang lalagyan para sa lahat ng mga elemento ng HTML. Ito ang root element ay nangangahulugan na ang lahat ng iba pang mga elemento ay dapat ilagay sa loob upang gumana nang maayos. Maaaring gamitin ang tag na ito upang tukuyin ang istraktura at nilalaman ng webpage at tumulong na tukuyin ang metadata tungkol sa dokumento. Gamit ang ' lang ” attribute ang wika ng HTML page ay maaaring itakda:
< html lang = 'sa' >// code
< / html >
Sa snippet ng code sa itaas, ang wika ng HTML na pahina ay nakatakda sa “ Ingles ”.
Ang Tag na “”.
Ang impormasyon tungkol sa webpage ay ipinasok sa loob ng '
// ipasok code dito
< / ulo >
Ang Tag
Ang tag na ay nagbibigay ng metadata tungkol sa HTML na dokumento, gaya ng set ng character, mga keyword, at paglalarawan ng pahina. Ito ay gumaganap ng isang mahalagang papel sa pag-optimize ng engine ng browser. Tinitiyak nito na ipinapakita ng web browser ang teksto nang tama gamit ang tamang mga pamantayan sa pag-encode. Ginagamit din upang itakda ang mga keyword at paglalarawan na nauugnay sa pahina ng HTML:
< meta ... / > Ang Tag
Ang '
Matapos isagawa ang linya ng code sa itaas sa loob ng '
Ang output sa itaas ay nagpapakita na ang dummy data na ibinigay sa loob ng '
Ang Tag
Ang tag na ito ay ginagamit upang i-link ang mga HTML file sa iba pang mga file upang mamana o gamitin ang estilo o mga pamamaraan sa HTML file. Ang iba pang mga file ay maaaring mga CSS file na nilikha ng developer o ilang CDN ng CSS frameworks tulad ng Bootstrap o Tailwind atbp. Ito ay malawakang ginagamit dahil sa paggamit nito ang linya ng code ay bumababa nang malaki at nagbibigay ng mga pre-build na istilo na magagamit sa ang HTML file:
< link rel = 'stylesheet' href = './style.css' >Sa itaas na linya ng code, ang ' style.css ” file ay nakakakuha ng link sa HTML file. Ngayon, ang mga klase na binuo sa loob ng 'style.css' na file ay maaaring ma-access upang ilapat ang estilo sa HTML file. Halimbawa, subukang i-istilo ang ' ” tag na naipasok na sa loob ng HTML file gamit ang mga sumusunod na katangian ng CSS:
h1 {font-family: times new roman;
kulay : darkcyan;
}
Ilagay ang code sa itaas sa “ style.css ” file. Pagkatapos i-render ang webpage ay lilitaw na ganito:
Ipinapakita ng webpage na ang mga istilo ay inilapat sa HTML na elemento mula sa panlabas na CSS file gamit ang “ ” tag.
Ang ' ' Tag
Ang pangunahing paggamit ng tag na
ay naglalaman ng lahat ng nakikitang nilalaman ng web page. Kabilang dito ang maraming tag na tumutulong sa paglalagay ng text, mga larawan, mga video, at iba pang mga elemento sa webpage na bumubuo sa pangunahing nilalaman ng web page. Maaari rin itong magamit upang ilapat ang mga katangian ng CSS sa web page nang sabay-sabay. Pinapabuti din nito ang pagiging naa-access ng webpage sa pamamagitan ng pagsasama ng mga semantic na tag at iba pang feature ng pagiging naa-access: < katawan >// Magdagdag ng mga elemento ng HTML dito
< / katawan >