Structura documentului HTML: Aflați structura de bază a HTML

Publicat: 2020-12-14

HTML a fost folosit ca limbaj standard de marcare pentru documentele accesibile pe internet prin datele browserului. HTML constă dintr-o serie de elemente scurte, etichete și coduri care, atunci când sunt compilate într-un format structurat, creează o pagină web pe care oricine o poate vizualiza cu acces adecvat la internet.

A schimbat modul în care oamenii lucrează. HTML și CSS sunt folosite pentru a crea și manipula elemente de pe o pagină web împreună cu javascript, HTML permite creatorilor să definească diferite roluri pentru fiecare element, oferind libertate deplină de personalizare în procesul de creare.

HTML înseamnă Hyper Text Markup Language și este folosit pentru a proiecta pagini web care sunt afișate pe site-uri web.

Există trei aspecte principale care, atunci când sunt puse împreună, ajută la construirea unei pagini web.

Structura HTML - acceptă elementele structurale
Stilul CSS — ajută la proiectare și oferă un stil acelor elemente structurale
Interacțiunea JS — permite interacțiunea dintre aceste elemente

În structura HTML, elementele și etichetele sunt asociate unele cu altele pentru a marca conținutul.

Fiecare pagină disponibilă pe internet include etichete HTML. Aceste etichete ajută la afișarea conținutului online cu o perspectivă clară și deschisă, care poate fi întotdeauna moderată și modificată. Pentru a explica lucrurile mai simplist, să descriem modul în care elementele și etichetele sunt utilizate în program.

Elementele de deschidere și de închidere se schimbă, dar etichetele rămân aceleași. Etichetele sunt inserate înainte și la sfârșitul propozițiilor, permițându-le să fie formatate pe pagină. O pagină web ideală constă din trei secțiuni principale și esențiale:

Titlu
Cap
Corp

Elementul Cap este folosit pentru a evidenția începutul/direcția secțiunii cap. Secțiunea de cap ajută întotdeauna ca o descriere a paginii. Conținutul din etichetele head, adică titlul, este ceea ce este folosit ca sursă pentru identificarea conținutului paginii.

Mai jos sunt enumerate toate etichetele care pot fi utilizate în elementul head:

<bază>
<link>
<meta>
<noscript>
<script>
<stil>
<titlu>

De exemplu:

<CAPE>

<TITLE> Un exemplu Hello world în HTML<TITLE>

</HEAD>

Elementele la nivel de bloc sunt folosite pentru a identifica anumite secțiuni ale unei pagini web, fie că este vorba despre un paragraf, subtitluri sau unele liste de creat.

Paragraf: <P>și </P>

Titlu, nivelul unu:<H1>Tit, nivelul doi:<H2>și </H2>

Regula orizontală:<HR> Centrare:<CENTRU>

Subsol : Nu există etichete speciale care să o denote, dar este totuși recomandat să aveți un subsol pe pagina web pentru a ajuta la identificarea secțiunilor care necesită contact cu autorul. Acestea pot include o secțiune de întrebări frecvente sau un e-mail pentru a vă abona la un buletin informativ.

<HTML>

<CAPE>

<TITLE>O companie de încălțăminte <TITLE>

</HEAD>

<CORP>

<H1>Bine ați venit la Amazing Shoes! </H1>: </H2>

<CENTRU> De ce să nu vizitați <A HREF =..http://www.example1.com/..>Exemplu de site web

</A>

</CENTER>

</BODY>

</HTML>

Secțiunea de mai sus a explicat elementele principale dintr-o pagină web a unei structuri HTML.

Acum, ne îndreptăm către sursa HTML și încercăm să înțelegem cum se poate folosi pentru a înțelege structura programului și elementele sale.

Ca începător, acest lucru ajută foarte mult să înțelegeți cum sunt dezvoltate alte pagini și pot fi folosite ca referință pentru a crea o versiune personalizată pentru propria pagină web.

Faceți clic pe butonul din dreapta oriunde pe pagina web și apoi selectați „Afișați sursa paginii”. Aceasta va deschide o fereastră care conține codul sursă al paginii.

Pentru a inspecta o pagină

Faceți clic pe butonul din dreapta oriunde pe pagina web și apoi selectați „Inspectați” pentru a vedea lista și tipurile de elemente utilizate pentru a crea pagina web specifică. Ar include atât HTML, cât și CSS, care pot fi modificate prin panoul de stil.

Cu structura de bază a HTML și etichetele sale explicate, acum să trecem la înțelegerea elementelor de bază necesare pentru a scrie conținut în HTML.

<p> Această etichetă este folosită într-o pagină web atunci când este nevoie de un paragraf, iar pentru a-l încheia este folosită eticheta </p>.

<br> Această etichetă este folosită pentru a întrerupe linii și este folosită mai ales pentru a scrie linii individuale, fie că este vorba de contact sau adresă.

<hr> Această etichetă este folosită pentru a separa conținutul paginii web în două secțiuni.

Toate etichetele de aici sunt implementate într-un exemplu de cod de pagină web

Aflați: 21 de idei de proiecte de dezvoltare web

INTRARE

<html>

<cap>

</cap>

<corp>

<h1>Structura HTML</h1>

<p>

Prin upGrad Education<br>

<hr>

Învață elementele de bază <br>

<hr>

Prin upGrad Education<br>

</p>

</corp>

</html>

Atribute

Pentru toate etichetele menționate, se folosește un atribut atunci când este nevoie de informații suplimentare. Atributele sunt definite cu doi parametri, și anume „valoare” și „nume”.

Aici, parametrul „nume” are o funcție pentru a prelua numele proprietății care este considerată a fi atribuită. Iar parametrul „valoare” are o funcție similară pentru a lua valoarea numelor de proprietate aliniate cu elementul.

<img> Acest atribut este folosit pentru a adăuga/încorpora o imagine în pagina web. Această etichetă va ajuta la specificarea căii imaginii. Iar <înălțimea> și <lățimea> indică înălțimea și, respectiv, lățimea imaginii.

<alt> Acest atribut este aplicat atunci când imaginea nu se poate încărca din cauza unei erori de conexiune sau dintr-un alt motiv. Eticheta alt servește ca subtitrare pentru imagine.

Înscrieți-vă la cursurile de inginerie software de la cele mai bune universități din lume. Câștigă programe Executive PG, programe avansate de certificat sau programe de master pentru a-ți accelera cariera.

Citiți: 8 idei și subiecte interesante pentru proiecte Full Stack

Exemplu

<html>

<corp>

<h2>Atributul src</h2>

<p>Imaginile HTML sunt definite cu eticheta img, iar numele fișierului sursei imaginii este specificat în atributul src:</p>

</corp>

</html>

Pentru modificarea stilului textului, mărimii, fontului și a oricărei alte funcții legate de text, se folosește eticheta <style>

Exemplu

<html>

<corp>

<h2>Atributul stilului</h2>

<p>Atributul este folosit pentru a schimba stilurile , cum ar fi culoarea:</p>

<p style="color:red;”>Acesta este un paragraf roșu.</p>

</corp>

</html>

Cu aplicațiile de modificare a textului, HTML oferă, de asemenea, etichete pentru a modifica textul la solicitări personalizate folosind aceste etichete.

<b> – text îngroșat
<strong> – Text important
<i> – Text italic
<em> – Text accentuat
<marca> – Text marcat
<mic> – Text mai mic
<del> – Text șters
<ins> – Text inserat
<sub> – Text indice
<sup> – Text în indicele

Pentru a rezuma articolul, am învățat următoarele caracteristici și elemente de bază ale HTML:

Structura HTML
Etichete, elemente și tipurile acestora
Etichetele de bază și aplicațiile acestora

Toate aceste caracteristici, etichete și atribute ajută la înțelegerea necesității de HTML.

Dacă sunteți interesat să aflați mai multe despre dezvoltarea de software full-stack, consultați programul Executive PG de la upGrad și IIIT-B în dezvoltarea software full-stack, care este conceput pentru profesioniști care lucrează și oferă peste 500 de ore de formare riguroasă, peste 9 proiecte, și misiuni, statutul de absolvenți IIIT-B, proiecte practice practice și asistență la locul de muncă cu firme de top.

Pregătiți-vă pentru o carieră a viitorului

Aplicați acum pentru masterat în inginerie software