HTML algajatele:

Veebitehnoloogiate ajaskaala


2009

2005

2002

2000

1998

1997

1996

1994

1991

HTML5

AJAX

Lauata veebikujundus

XHTML1

CSS2

HTML4

CSS1 + JavaScript

HTML2

HTML

Contents

Sissejuhatus

Kui soovite saada veebimeistriks ja õppida veebisaiti looma, võite leida HTML-iga tegelemise võimaluse üsna hirmuäratava..

Seda ei saa siiski vältida, kuna valdav enamus teie külastatud veebisaitide sihtlehtedest on kirjutatud ja üles ehitatud HTML-elementide abil. Tegelikult on HTML nüüd kasutab rohkem kui 74% kõigist teadaolevatest veebisaitidest, kuigi see keel aitab parandada ka kõike teie saidi kujundamisest kuni selle sisu kvaliteeti.

Selles juhendis uurime HTML-i ja selle võimalike rakenduste aluspõhimõtteid, enne kui vaatame üksikute elementide näiteid, mida kasutate oma veebisaidi kodeerimisel.

Mis on HTML?

Protsendid veebisaitidel, mis kasutavad HTML-i erinevaid alamkategooriaid

HTML-i protsentide erinevad alamkategooriad

Lihtsamalt öeldes, HTML tähistab standardset märgistuskeelt veebisaitide veebis loomiseks. See tähistab hüperteksti märgistuskeelt ja selle peamine ülesanne on luua üksikute sihtlehtede struktuur, paigutus ja esitusviis. Kuigi veebibrauserid ei kuva HTML-keelt otse, mängib see keskset rolli nähtava, juurdepääsetava ja hõlpsasti kasutatava saidi loomisel.

HTML-i toetavad ka mitmed üksikud elemendid, mis ehitavad järk-järgult veebilehti, struktureerivad sisu esitust ja annavad teie veebisaidile elu. Need elemendid luuakse ja sisalduvad märgendites, mis määratlevad alternatiivsed sisutükid, näiteks pealkirjad, lõigud ja sarnased näited.

Järgnevalt uurime neid elemente ja nende ülesehitust üksikasjalikumalt, uurides ühtlasi, kuidas neid isikupärastada, et teie veebisaidile värvi, linke ja muutujate tüpograafiat tutvustada.


Kus kasutatakse HTML-i?

HTML-i kasutavad populaarsed veebisaidid

Kus kasutatakse HTML-i

Nagu näeme, on HTML-i kõige tavalisem rakendus teie veebisaidi moodustavate üksikute sihtlehtede kujundus. See pole populaarse kodeerimisriista ainus rakendus, kuid selle täiendavate kasutusviiside mõistmine aitab teil uue veebimeistrina keelest maksimaalselt kasu saada.. Siin on mõned HTML-i täiendava kasutamise viisid:

  • Looge olemasoleval lehel kohandatavad elemendid

    Kui kavatsete oma veebisaidil lubada ajaveebi postituste kommentaare või publikatsiooni kasutaja loodud sisu, saate selle lubamiseks kasutada HTML-koodi fragmente. Need elemendid võimaldavad kasutajatel rõhutada märksõnu, manustada linke ja vormindada kommentaare sõltuvalt moderaatori seatud piirangutest.

  • Looge e-posti jaoks täiendav sisu

    E-post kasutab rikkalike tekstisõnumite keelena ka HTML-i, mis sisaldab linke, teksti ja mitmesuguseid muid elemente, mida ei saa esitada pelgalt lihttekstina. Niisiis, kui soovite jagada oma veebisaidiga e-raamatut e-posti teel, saate oma sõnumi mõju optimeerimiseks kasutada HTML-i.

  • Mõistage arvutisse installitud võrguühenduseta abidokumente

    Huvitav on see, et HTML-i kasutatakse võrguühenduseta juurdepääsetavate arvutipõhiste abidokumentide vormingus. HTML-i põhiteadmised võivad seetõttu aidata teil riistvaraga seotud probleemidest paremini aru saada ja neid kiiremini lahendada, mis omakorda võib tagada, et saate oma veebisaidi kiiremini taastada siis, kui see on võrguühenduseta sisse lülitatud..

HTML ja CSS
Kuva HTML ja CSS [petuleht]

HTML-i lehe struktuur

</strong><br/> <strong>
Lehe sisu

HTML, pea ja kere elemendid on olnud HTML-i spetsifikatsiooni osaks alates 1990. aastate keskpaigast ja kuni paar aastat tagasi olid need peamised elemendid, mida kasutati HTML-dokumentide struktuuri loomiseks.
Olukord on aga viimastel aastatel dramaatiliselt muutunud, kuna HTML5 on lisanud hulgaliselt uusi silte, mida saab kasutada HTML-dokumendi struktuurile rikkaliku semantilise tähenduse lisamiseks.

HTML-dokumente tuleb alustada dokumenditüübi deklaratsiooniga (mitteametlikult „doctype”). Brauserites aitab doctype renderdusrežiimi määratleda. HTML5 ei määratle DTD-d; seetõttu on HTML5-s doktüübi deklaratsioon lihtsam ja lühem.


Enne html-lehe üles ehitamist vajate põhitõdesid.

Tavaliselt koosneb leht kolmest struktuurielemendist:

1. Päis: Päis sisaldab teie saidi kõigi lehtede jaoks olulist sisu, näiteks logo või veebisaidi nimi ja navigatsioonisüsteem. Päist on näha igal lehel.

2. Põhiosa: See hõlmab veebilehe suurimat ala. See sisaldab sisu, mis on spetsiifiline vaadatava lehe jaoks.

3. Jalus: Jaluse sisu sisaldab tavaliselt kontaktteavet, tarneaadressi või juriidilisi teateid. Nagu päis, ilmub jalus ka igal lehel, kuid see asub allosas.

Need põhilised konstruktsioonielemendid kokku tulles näevad välja järgmised:


Saate siia lisada teksti või koodi, näiteks a
Google Analyticsi jälgimiskood domeenile
näide.

Teie lehe põhiosa läheb edasi
siin. Täitke see teksti ja piltidega!

Siin on veel üks näide, kus päisesiltide ja lõigumärgendite kasutamine sisu esteetiliseks struktureerimiseks. Lisaks oleme visanud lehe põhiosa alla oleva sisu jaluse sildi:


Saate siia lisada teksti või koodi, näiteks a
Google Analyticsi jälgimiskood domeenile
näide.

Minu esimene rubriik

Tere tulemast minu veebisaidile!

kontaktteave võib siia minna


HTML-sildid

HTML-sildid

Mis tahes HTML-koodi lähtepunktiks on üksikud sildid, mida saab kasutada kõigi oluliste elementide loomiseks ja teie veebilehtede struktureerimiseks. Allpool vaatleme kõige tavalisemaid silte, enne kui uurime, kuidas neid konkreetsete lehel olevate elementide genereerimiseks kasutada:

Rubriigi sildid

Kõik veebidokumendid, sealhulgas veebilehed, algavad pealkirjaga. Nende konstrueerimiseks kasutatakse HTML-silte, kusjuures keel võimaldab praegu kuni kuut erineva suurusega elementi, mis võimaldavad teil ka oma sisu struktureerida täiendavate pealkirjade, subtiitrite ja rasvases kirjas esiletõstetud ridadega. Rubriigi alustamiseks lisage lihtsalt asjakohase teksti eesliide

,

,

,

,

või
silt sõltuvalt soovitud suurusest.
Seejärel peate teksti kapseldamiseks pealkirja lõpus kasutama sulgevat silti ja see kuvatakse HTML-vormingus järgmiselt:

Sildid on 12 kategoorias:


See on rubriik 1

See on rubriik 2

See on rubriik 3

See on 4. rubriik

See on rubriik 5

See on rubriik 6

Juhtivad HTML-siltide tehnoloogiad
jaga veebis

0,27%

HTML5
Lõuendi silt

0,29%

HTML5
Helisilt

0,69%

HTML5
Videomärgend

3,1%

HTML5
SVG silt

6,54%

HTML5
Manustage silt


Pärast kinnitust saab see teie veebisaidil järgmise esteetika’maandumisleht:

See on rubriik 1

See on rubriik 2

See on rubriik 3

See on 4. rubriik

See on rubriik 5

See on rubriik 6

Siin on selgelt näha muutuvate pealkirjade erinevad suurused, nagu ka asjaolu, et brauser lisab rea enne ja pärast pealkirja. Samuti märkate, et pealkirja teksti lõpus olev sulgev silt on veidi erinev esteetiline, kuid katame seda järgmises peatükis, kuna me otsime siltide kasutamist konkreetsete elementide määratlemiseks.

Lõikesildid

Video ja heli tugi
Unustage Flash Player ja muud kolmandate osapoolte meediumipleierid, muutke oma videod ja heli uue HTML5 abil tõeliselt juurdepääsetavaks

Sarnast põhimõtet rakendatakse ka lõigu siltide jaoks, mida tähistab

. See võimaldab teil oma sisu struktureerida ja jagada asjakohasteks lõikudeks, mis omakorda tähendab lihtsamat ja sujuvamat lugemiskogemust. Taas kord

silt tuleks asetada vastava teksti algusesse, enne kui efekti lõpuleviimiseks kasutatakse alternatiivset sulgevat silti. Erinevalt pealkirjasiltidest pole aga arvulisi erinevaid, mis muudaksid lõigus toodud teksti suurust. Näiteks:

Sinu esimene lõik

Teie teine ​​lõik

Teie kolmas lõik

HTML5 videomärgise kasutamine veebisaitidel kogu maailmas

Riik
Veebisaitide arv
Ühendriigid
140,008
Venemaa
87,508
Saksamaa
34 519
Ühendkuningriik
26,609
Prantsusmaa
25,697
Jaapan
23,578
Taiwan
19,798
Ukraina
19,204
Brasiilia
16,773
Hiina
16,523
Muu maailm
265,371

Väljaspool HTML-vormingut jaotab see teie valmis veebilehel teksti järgmiselt:

Sinu esimene lõik

Teie teine ​​lõik

Teie kolmas lõik

Ridade katkemise sildid

Esimesed näited esindavad kõige põhilisemaid HTML-silte, kuid on ka teisi, mis kasutavad teistsugust vormingut ja alternatiivseid sulgemisvõtteid. Võtke näiteks reavaheajad, mis loovad vahet, millistel tekstiridadel purustatakse ja jätkatakse järgmisel real. HTML-i väljal on reavahetuste ja lõikude vahel erinev erinevus, kuna kuigi viimased on standardsed teksti sisaldavad plokielemendid, loob esimene eralduse olemasolevas

element.

Seetõttu tähistavad reavahetused HTML-i tühja elementi ja seetõttu ei määratleta neid siltide avamise ega sulgemisega. Selle asemel on neid kujutanud
silt, mille saab sisestada olemasolevasse

elemendid teksti tükeldamiseks ja olulise teabe potentsiaalseks esiletõstmiseks. Märgi br ja täpse kaldkriipsu vaheline tühik on ülioluline, kuna vastasel juhul pole silt HTML-vormingus äratuntav.

Siin on näide:

on joonistamise HTML5 joonise silt, mis võimaldab teil kasutada veelgi rohkem veebi interaktiivsust ja veebianimatsiooni kui eelmistel rikkalike Interneti-rakenduste platvormidel, nagu Flash.
HTML5-de abil saate isegi mänge arendada silt. HTML5 pakub suurepärast, mobiilisõbralikku viisi lõbusate, interaktiivsete mängude arendamiseks

Tere hommikust

Suur tänu teie järelepärimise eest, võtame teiega ühendust, kui vajame midagi muud.

Parimate soovidega

Hr J need

Pärast rakendamist jaotab see teksti järgmiselt:

Tere hommikust,

Suur tänu teie järelepärimise eest, võtame teiega ühendust, kui vajame midagi muud.

Parimate soovidega

Hr Jones

Nagu näete, saate olemasolevas lõiguelemendis reavahetusi rakendada nii tihti, kui soovite, kui need lisavad lisaväärtust ja muudavad teabe hõlpsamaks seedimiseks. Samuti näete, et lõigu avamise ja sulgemise sildid jäävad muutumatuks. Reavahetuse silte kasutatakse tekstis sisalduva teksti paigutuse muutmiseks.

See on üks näiteid selle kohta, kuidas HTML-silte saab olemasolevate elementide muutmiseks kasutada. See mängib võtmerolli teie veebilehtede ja sisu visuaalse paigutuse määratlemisel.

Horisontaaljooned

Veebisaidikategooriad, kus HTML5 lõuendi silti kasutatakse

Veebisaidikategooriad, kus HTML5 lõuendi silti kasutatakse

Sarnaselt on ka teisi silte, mida saab kaustas kasutada

elemendi või oma veebisaidi teksti eraldi eraldamiseks. Üks levinumaid on


silt, mis aitab luua tühja elemendi, mis tõmbab visuaalse horisontaalse joone veebidokumendi alternatiivsete sektsioonide vahele. Võib-olla soovite paigutada rea ​​kahe tekstiosa vahele, näiteks selleks, et suunata lugeja tähelepanu või lihtsalt tutvustada uut visuaalset elementi. Sellise HTML-i pausi loote järgmiselt:

Sinu esimene lõik


Teie teine ​​lõik

Hr märkide ja kaldkriipsu vaheline esiletõstmine toob siin esile tühja elemendi ehituse, samas kui efekti lõpetamiseks pole jällegi vaja sulgemissilti. See loob järgmise visuaali:

Sinu esimene lõik
________________________________________

Teie teine ​​lõik

Sinu esimene lõik
_______________________

Teie teine ​​lõik

Mobiilibrauserid on HTML5 täielikult kasutusele võtnud, nii et mobiilseks kasutamiseks valmis projektide loomine on sama lihtne kui nende väiksemate puutetundlike ekraanide kujundamine ja ehitamine – sellest tulenevalt on ka tundliku disaini populaarsus. Leidub vahvaid metasilte, mis võimaldavad teil ka mobiilseadmeid optimeerida
78% sisuarendajatest nõustub, et see struktuur sobib mobiilirakenduste loomiseks, ja 68% leiab, et see sobib igasuguste rakenduste kavandamiseks


Pildisildid

Piltsildid tähistavad HTML-is ka tühje elemente, mis jällegi tähendab, et neil pole sulgevat silti. Kuna need sisaldavad ainult atribuute, mis on seotud saidi manustatava pildi URL-iga, määratleb need lihtsalt silt elemendi alguses. Neid saab paigutada oma veebisaidi ükskõik kuhu, kuigi on ebatavaline, kui neid lisatakse olemasolevatesse elementidesse, näiteks lõikudesse või pealkirjadesse. Tüüpiline HTML-kujutise silt ilmub järgmiselt:

mingi_tekst

Peaksite oma pildile lisama ka alternatiivteksti, mis aitab inimestel seda vaadata aeglaste laadimisaegade või ekraanilugeja kasutamise korral. Sel viisil, kui brauser ei leia pilti, kuvatakse sellel vaatajatele alternatiivse atribuudi väärtus. See kasutab taas pildisilti, kuid sisaldab erinevaid atribuutide komplekte:

 HTML5 Icon

HTML-elemendid

html elemendid

Varem uurisime, kuidas lihtsaid HTML-silte kasutatakse leheelementide määratlemiseks, uurides ka, kuidas neid saaks veelgi kohandada, kasutades tühje elemente, mis sisaldavad pildi- ja reavahetussilte. See aitab meil mõista siltide ja elementide vahelist seost ning seda, kuidas neid saab kasutada teie veebisaidi erinevat tüüpi sisu määratlemiseks.

Kuigi HTML-i kõiki aspekte esindab silt, näiteks peab sisu sisaldav määratletud element sisaldama nii algus- kui ka lõppsilti. Niisiis on pealkirjad ja lõigud HTML-elemendid, kuna nad kasutavad vastava teksti kapseldamiseks ja täiendamiseks algus- ja lõppsilte. Seevastu tühjad elemendid kas sisaldavad atribuute või ei sisalda üldse sisu, võimaldades neid olemasolevates elementides kasutada ilma sulgemissilti vajamata.

HTML-elementide määratlemine

HTML5 ei lähe kuhugi ja üha enam elemente võetakse kasutusele üha rohkem ja rohkem ettevõtteid hakkab HTML5-s arendama

Näidete (nt pealkirjad ja lõigud) kasutamisel on ülioluline algus- ja sulgemissiltide õige rakendamine. See on stardisilt (näiteks

või

), mis määratleb näiteks kõnealuse elemendi, samal ajal kui sulgev silt tagab, et seda elementi ei jätkata kogu ülejäänud veebilehel. Kui sul ei õnnestu sulgurit kasutada näiteks sildi soovitud lõigu lõpus, ilmub tekst ühes plokis, mis on inetu ja eriti raskesti loetav.

Kõik sulgevad sildid on identsed algussiltidega, välja arvatud asjaolu, et esimestel on vastavate märkide ees kaldkriips. Nii et

pealkiri, lõppsilt saab , lõikude puhul kasutate seda alati teksti katkemise määratlemiseks. See nõuab kodeerimise ajal tähelepanu pööramist detailidele ja pealkirjade programmeerimisel on oluline arvestada, et kasutatav number (nt h1 või h2) rakendatakse nii algus- kui ka sulgemissiltides.

Erinevate HTML-i elementide kasutamissagedus

XHTML-elemendi nimi
pea
pealkiri
html
keha
a
meta
img
laud
td
tr
br
lk
skript
font
div
b
link
Keskus
span
vorm
sisend
stiil
tund
tugev
i
hl
li
noscript
kaart
ala
ul
vali
valik
h3
h2
raam
raamikomplekt
param
manustama
em
u
objekt
blockquote
ei
raamid
tbody
iframe
väike
h4
alus
nord





























0
10
20
30
40
50
60
70
80
90
100

Pesastatud HTML-i elementide kasutamine

Selles etapis on selge, et HTML-dokumendid ja veebilehed on moodustatud erinevatest elementidest koosneva puu abil, mis on varade massiivi ehitusplokkideks. Vaatasime ka, kuidas neid elemente saab veebisisu struktureerimiseks moodustada ja kasutada, ning jätkame seda nüüd pesastatud HTML-i elementide vaatamisega.

Täpselt samamoodi nagu tühjad elemendid ja eraldiseisvad sildid (nt
saab lisada määratletud HTML-i elementidesse, nn pesastatud elemente saab paigutada ka sisusse, näiteks pealkirjadesse ja lõikudesse. Need hõlmavad näiteid, näiteks paksus kaldkirjas ja allakriipsutatud tekst, kuid neid saab kasutada isikupära lisamiseks teie sisule ja lugeja silma tõmbamiseks konkreetsetest huvipunktidest..

Rasvane, kaldkiri ja allajoonitud tekst HTML-is

Lase’ütlevad, et soovite sõna esile tõsta olemasolevas lõiguelemendis. Selle saate saavutada julgelt muutes, kasutades standardi piires lihtsaid silte

element. HTML-i kasutades programmeerite selle järgmiselt:

ma tahan see sõna julge olema.


Pesastatud elemendil on nii algus- kui ka lõppsilt, mis kõik järgivad sama pealkirja ja lõiguga seotud vormingut. Neid saab olemasolevates elementides sujuvalt kasutada ja sel juhul annavad need järgmised tulemused:

ma tahan see sõna julge olema.

Las nüüd’s ütlevad, et soovite ka selle sõna tüpograafiat muuta nii, et see oleks ka kaldkirjas. Seda saab saavutada lihtsalt teise pesastatud elemendi lisamisega, mis peaks olema järgmiselt kodeeritud:

ma tahan see sõna julge olema.

Nagu näete, on kaldkirjas olevad alg- ja lõppsildid lihtsalt lisatud

element. See muudab elemendi sisu nüüd selliseks, et see kuvatakse järgmiselt:

HTML-i pealkirjad on alati olnud ja jäävad kõige olulisemaks HTML-signaaliks, mida otsingumootorid lehe mõistmiseks kasutavad. Tegelikult, kui teie HTML-i pealkirju peetakse halbadeks või pole kirjeldavad, muudab Google neid
ma tahan see sõna julge olema.

Muidugi võite otsustada, et eelistaksite seda sõna teisiti esile tõsta. Seetõttu võite kasutada alternatiivset pesastatud elementi, näiteks allajoonimist (mida tähistab ja sildid. Neid silte saab rakenduses

element, mis kuvatakse HTML-is järgmiselt:

ma tahan see allajoonitav sõna.

Sel juhul kuvatakse tekst teie dokumendil või sihtlehel järgmiselt:

Uued semantilised elemendid, mille HTML5 tutvustas, muudavad lootust lootust lootavatele arendajatele. Selle asemel, et näha rida rea ​​järel
ja elemendid, täpsemalt määratletud sildid, näiteks
,
ja
ma tahan see allajoonitav sõna.

See annab ülevaate elementidest, mida saab moodustada siltide abil, mis omakorda määratlevad teie veebilehtede struktuuri ja nende sisu. Mitte ainult seda, vaid ka tühje ja pesastatud elemente saab kasutada oma sisu edasiseks määratlemiseks.

HTML-atribuudid

Globaalsed atribuudid on atribuudid, mis on ühised kõigile HTML-i elementidele; neid saab kasutada kõigil elementidel, kuigi atribuudid ei pruugi mõnel elemendil mõju olla. Globaalseid atribuute võib täpsustada kõigis HTML-i elementides, isegi standardis määratlemata


Kui silte moodustavad elemente konstrueerivad ja määratlevad ehitusplokid, saab nende omaduste kohandamiseks kasutada HTML-atribuute (näiteks stiil, värv ja keel. Kõigil HTML-i elementidel on tuumatribuudid, mis pakuvad põhiteavet ja on alati täpsustatud märgendis stat) Need kipuvad tulema paarikaupa, nii et need ilmuvad sageli järgmises vormingus: nimi =”väärtus.“

Lihtsamalt öeldes tähistab nimi atribuuti, mida soovite seada, samas kui väärtus on seotud konkreetsete kriteeriumidega, mida soovite kaasata.

Teie HTML-i elementidele saab rakendada palju atribuute, kuid need, mis on algavatele veebimeistritele kõige olulisemad, on järgmised:

‘Langi’ atribuut

Kõige lihtsam atribuut, see määratleb dokumendi keele ja selle elemendid. See deklareeritakse, kasutades ‘lang’ atribuuti ja kuigi seda on kerge kahe silma vahele jätta, on selle eeliseks see, et sisu on ekraanilugejatele ja otsingumootoritele paremini juurdepääsetav. Tavaliselt esitatakse see dokumendi alguses järgmises vormingus:

Tunnustatud on mitu põhitunnuse tüüpi, sealhulgas:

nõutavad atribuudid, mida element vajab teatud elemendi tüübi korrektseks toimimiseks

valikulised atribuudid, kasutatakse elemenditüübi vaikimisi funktsioonide muutmiseks

standardsed atribuudid, mida toetab suur arv elemente

sündmuse atribuudid, kasutatakse elementide tüüpide tekitamiseks, et täpsustada skripte, mida konkreetsetel tingimustel käitatakse


Pärast atribuuti lang täpsustavad kaks esimest tähte keelt (mis antud juhul on inglise keel). Pärast sidekriipsu määravad järgmised kaks tähte murret, ehkki see puudub kõigis keeltes. Kui soovite oma publikuni edukalt jõuda, peate selle atribuudi õigeks saama.

Atribuut ‘Joonda’

HTML-atribuutide vormingut (nimi =”väärtus) ja selle parim kehastus ilmneb siis, kui proovite oma elementide sisu joondada. Võite otsustada koondada kõik lõigud konkreetsele lehele, näiteks kui joondamine on atribuut, mida soovite seada. Järgnevalt, ’Keskus’ on atribuudi väärtus, kuigi teil on valida, kas joondada oma tekst vasakule või paremale. Näiteks:

See tekst on joondatud keskele

HTML5-ga loodud rakenduste tüübid

Tootlikkus
54%
Utiliit
38%
Tarbija
35%
LOB
22%
Sotsiaalvõrgustik
18%
Meelelahutus
17%
Eluviis
12%
Reisima
9%
Mängud
8%
Muud
13%

See joondab teie

elemente lehe keskel ja looge ühtne paigutus, mis sobib teie veebisaidi konkreetse olemusega (vt allpool):

See tekst on joondatud keskele
See tekst on joondatud keskele
See tekst on joondatud keskele

Atribuut ‘Href’

HTML5-ga on kaasas ka hulgaliselt suurepäraseid API-sid, mis võimaldavad teil luua parema kasutajakogemuse ja mitmekesisema, dünaamilisema veebirakenduse – siin on kiire nimekiri natiivsetest API-dest:
  • Lohistamine (DnD)
  • Võrguühenduseta andmebaas
  • Brauseri ajaloo haldamine
  • Dokumentide redigeerimine
  • Ajastatud meediumiesitus

Kui plaanite üles ehitada nähtava veebisaidi, on oluline kaasata nii sissetulevad kui ka väljaminevad lingid. Lingiportfelli loomine, mis sisaldab lingid sisemistele sihtlehtedele, on samuti mõistlik strateegia, nii et peate õppima, kuidas neid HTML-is kodeerida.

HTML-lingid määratletakse silt, mis sisaldab sihtkoha linki koos seotud ankrutekstiga, mis sisaldab URL-i. See on ‘href ’ atribuut, mis täpsustab saidi aadressi, kuid see on lisatud algusse sildi osana. See on HTML-is kodeeritud järgmiselt:

Google

See rõhutab selgelt alg- ja lõppsildi vahet ning tõlgib teie sihtlehel järgmiselt:

Ükski ettevõte ei kontrolli HTML5-d. Selle üks parimaid omadusi seisneb selles, et see on avatud standard. Arendajatel on vabadus lasta oma loovusel voolata ja lisada võimalikult palju funktsioone ja funktsioone


Atribuut ‘Värv’

See on veel üks oluline atribuut, kuna värvi kasutamine võib teie veebisaidile elu sisse hingata, aidates samal ajal luua olulisi kontraste ja tugeva kujunduse esteetika. HTML-is saab värvi täpsustada selle nime abil, kuigi selle eesmärgi saavutamiseks on võimalik kasutada ka RGB- või HEX-väärtust. Eelmist varianti on kõige lihtsam jälgida, kuid seda saab rakendada ka teie lehe pealkirjade, lõikude ja muude elementide jaoks.

HTML5 lõuend
Vaadake HTML5 lõuendit [petuleht]

See on stiiliatribuut, mille värvivalik tähistab väärtust, mida soovite seada. Näiteks punase värvi pea pealkirjale kandmisel näeb see välja järgmine:

Taustavärvi määramine punasega

Pärast selle rakendamist ilmub see element teie veebisaidil järgmiselt:

Taustavärvi määramine punasega
Võrreldes teiste brauseritega peab iga Google Chrome’i värskendus kindlasti sisaldama HTML5 tuge. Lisaks on YouTube’i vaikepleier nüüd HTML5 ja Google’i Flash-reklaamid konverteeritakse nüüd HTML5-ks


Jällegi on elementi määratlevad algus- ja lõppsildid selgelt eristatud, kuigi see on üks lihtsamaid atribuute, mida HTML-is rakendada. See tõstab veelgi esile nime =”HTML-i atribuutide väärtusvorming, muutes nende õppimise ja kohaldamise kogu veebisaidil palju lihtsamaks.

Pange ennast proovile

HTML-i ja selle üksikute elementide põhiteadmistega on järgmine samm algatada mõned lihtsad projektid ja rakendada oma teoreetilisi teadmisi praktiliste väljakutsete lahendamiseks.

HTML5-ga töötavatel brauseripõhistel rakendustel pole geograafilise asukoha kasutamist probleemidega

Allpool üksikasjalikult kirjeldatud harjutuses oleme kirjeldanud teksti, välja arvatud ja palunud vormindada erinevad aspektid HTML-i abil. Kasutage juhendit ja kõike seda, mida olete seni õppinud, väljakutse täitmiseks, kui valmistute oma veebisaidi kodeerimiseks.
________________________________________

Peamine päis

Tere tulemast meie veebisaidile, example.com! Loodame, et teile meeldib meie sisu lugemine ja võtke meiega julgelt ühendust.

Täname, et külastasite!

Lisateave.

HTML5 kasutamine arendajate poolt
(piirkonna järgi)

Põhja- ja Ladina-Ameerika
70%
Lõuna-Ameerika
61%
ASPAC
60%
Austraalia
60%
Euroopa
59%
Aafrika
50%

________________________________________

Küsimused:

  1. Täitke päise element õige sulguriga.
  2. Tehke päis paksuks.
  3. Sisestage päise alla horisontaalne joon.
  4. Kasutage värvi atribuuti ja varju ‘Täname, et külastasite’ roheline
  5. Sisesta see hüperlink (https://www.w3schools.com/html/) ankruteksti sisse “Õppige
    rohkem.”
  6. Kasutage lehe eesosas nime =”väärtuse vorming lõikude vasakule joondamiseks


Järeldus

Kui HTML loodi alles 1991. aastal (kodeerimiskeele esimene versioon ilmus hiljem 1995. aastal), on sellest kiiresti saanud funktsionaalsete ja visuaalselt atraktiivsete veebisaitide kujundamise tööriist. Ka HTML-i mõjutase areneb pidevalt ning uusimat iteratsiooni (HTML5) võtab vastu üha suurem arv veebisaite kogu maailmas.

Sellega seoses on HTML-i põhielementide õppimine ja nende rakendamine kõige olulisem samm eduka, nähtava ja konkurentsitiheda veebisaidi loomisel..

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me

    Like this post? Please share to your friends:
    Adblock
    detector
    map