Kindlasti on iga töötu internetikasutaja kokku puutunud olukorraga, kus ilusale veebilehele sisenedes mõtled, mis juhtuks, kui sellise veebilehe teeksid, sest hea kodulehe olemasolu toob sulle raha ja võib-olla isegi kuulsust. Teil on selleks soov ja soov, sisestate kohe otsingumootorisse "Kuidas luua veebisaiti?" Peaaegu kõikjal öeldakse teile, et hea veebisaidi loomiseks peate õppima HTML-i. Kui olete selles ettevõttes uus, soovite tõenäoliselt teada, mis see on.
Selgitan teile lühidalt, mis on HTML minu enda sõnadega, mis on arusaadavam kui Vikipeedias.
HTML on peamine veebiprogrammeerimiskeel, mis on kõigi veebisaitide koostamise põhitõdede aluseks. Peaaegu kõik veebisaidid on kirjutatud selles keeles. Saidil oleva teksti suurus, pildi suurus ja asukoht, saidi taust jne. kõik see on selles keeles kirjutatud. HTML on see, millega veebisaidid sündisid, mis tähendab, et see on peaaegu kõigi veebilehtede emakeel. Näiteks kui olete hiinlane, siis räägite hiina keelt, kui olete ukrainlane, siis räägite ukraina keelt, aga kui olete veebisait, siis räägite HTML-i. Iga hea veebiprogrammeerija tunneb HTML-i peaaegu peast ja oskab seda hästi.
See keel on arusaadav ja kergesti õpitav, kuid nagu kõik selle maailma keeled, vajab see hästi rääkimine harjutamist. See tähendab, et isegi kui õpite selle täielikult selgeks, ei saa te kohe head veebisaiti teha; vajate aega, kannatlikkust ja harjutamist. Tavaliselt ei ole algajatel oma veebiprogrammeerija teekonna alguses lihtsalt kannatust kõike õppida ja samm-sammult harjutada. Need, kes sooritasid testi, õppisid kõik selgeks, said keelt õppides praktikas kogemusi ega andnud alla – ootab hea tasu.
Veebi programmeerimiskeeli on mitu. Lihtsa veebisaidi loomiseks vajate ainult ühte keelt, peamist, nimelt HTML-i. Keerulise ja mahuka veebilehe ehitamiseks läheb vaja nii-öelda abikeeli, mille kohta saad teada juba HTML-keele õppimise ajal või pärast seda. Kui otsustate alustada veebiprogrammeerija teed, võite alustada HTML-i õppimist kohe. Pidage meeles kõige olulisemat - kui võtate selle, ärge heitke ja ärge loobuge, sest see rikub enamiku programmeerijaid.
Need neli HTML-i tähte tähistavad mitut sõna, nimelt Hyper Text Mark-up Language, mis vene keeles kõlab nagu hüperteksti märgistuskeel.
Miks on HTML-i vaja?Miks seda keelt vaja on? Miks teda õpetada? Miks mitte mõni teine? Või miks seda isegi õppida, kui veebisaidi hõlpsaks loomiseks on hunnik muid programme?
Nagu ma ütlesin, on HTML peamine veebiprogrammeerimiskeel. See ei ole ainus keel, mida veebisaitide loomisel kasutatakse, kuid see on peamine tööriist, mis juhendab teisi keeli, seega on see hädavajalik õppida. Isegi kui kasutate veebisaidi loomise programmi või valmis malle, muudab HTML teie elu palju lihtsamaks. Veelgi enam, kui soovite tulevikus luua head, suurt ja professionaalset veebisaiti, ei aita teid programmid ja mallid, kõik algab nullist ja selle keele oskus aitab teid selles.
Kuidas HTML-i kasutadaSeda keelt on väga lihtne kasutada ja see on kõigile kättesaadav. Seda saab kasutada isegi tavalises märkmikus (.txt). Kasutamise mugavamaks muutmiseks on spetsiaalsed programmid, näiteks Notepad++. Lisateavet selle keele kasutamise kohta kirjeldatakse HTML-i õppetundides.
Kuidas õppida HTML-iHTML-i õppimiseks peate varuma palju kannatlikkust, et selle keelega hakkama saada. Õppida on lihtne, aga peaasi, et omandad kogemusi, praktikat, mida rohkem praktikat, seda parem veebiprogrammeerija oled.
Igal saidil on erinev välimus ja funktsionaalsus, kuid millega see seotud on ja mis keeles leht on kirjutatud? Kõige selle jaoks kasutatakse kaskaadlaadilehti ja HTML-i. Selle keele koodi saate ise vaadata, kui vaatate objekte brauseris. Selles artiklis räägime konkreetselt sellest, mis on HTML.
Meie artikkel on suunatud peamiselt algajatele, nii et loodame, et tavalised ajaveebi lugejad mõistavad!
Postitus jaguneb järgmisteks punktideks:
Mis on HTML-lehtMärgistuskeelt nimega HTML kasutatakse kõigi leheelementide, sealhulgas tabelite, piltide ja teksti kujundamiseks. Koodiga saate tutvuda ja sellest aru saada, kui kasutate mõnda kaasaegset brauserit, lihtsalt paremklõpsake lehel ja klõpsake menüüs real "lehe lähtekood" või "HTML-kood". Pärast seda näete midagi redaktori sarnast, milles on palju arusaamatuid pealdisi ja sümboleid, see on HTML-i keelekood.
Igal WWW-dokumendil on vormindatud ja kaunilt kujundatud tekst, samuti hüperlingid ja pildid, mille valib saidi omanik. Nende elementidega töötamiseks lõid programmeerijad keele nimega HTML (Hyper Text Markup Language), mis tõlkes tähendab hüperteksti märgistuskeelt. Iga brauser töötab ja kuvab HTML-i erinevalt, seega kuvatakse see erinevates brauserites, eriti Internet Exploreri vanemates versioonides, erinevalt.
Kõik HTML-dokumendid on sarnased – see on standardne tekstifail, millel on antud keele märgistussildid koos tekstidega, mida saidi külastajad loevad. Leht luuakse siltide abil ja neid loeb brauser selle laadimisel. Märgiste ja nende kujunduse defineerimisega saate paigutada artikli või muu materjali lehe kindlasse kohta, lisada graafilisi faile ja fotosid, samuti hüperlinke saidi teistele lehtedele. Esialgu ei ole HTML-fail veebidokument, vaid sellest saab alles pärast seda, kui brauser on selle läbi lugenud.
Muidugi on standardsel HTML-koodil omad puudused ja miinused. Peate kõvasti pingutama, et lehel tekstiga lõike järjestada, sest märgistuse ja kõige muu jaoks peate registreerima teatud atribuudid kogu teksti ja iga üksiku lõigu jaoks. Kui teie saidil on 50 lehekülge ja igal 10–20 lõiku, võtab teksti vormindamine ja iga kord samade siltide sisestamine väga kaua aega. See mitte ainult ei väsi saidi omanikku, vaid mõjutab negatiivselt ka saidi lehtede kaalu. Just sel põhjusel loodi hiljem kaskaadlaaditabelid, lühidalt nimetatakse neid CSS-iks, mis tähendab Cascading Style Sheets, tänu neile saab kiiresti teksti kujundada. Saate määrata ühe sildi ja anda sellele teatud omadused, nagu teksti värv, suurus, font jne, ning seejärel rakendada seda lõikudele. Sellisel juhul salvestatakse stiililehega fail eraldi, selle saab üles laadida ühele saidile või mitmele korraga. Järgmiseks kirjutatakse lehe põhielemendid HTML-i ja sisestatakse tekst ning seejärel ühendatakse CSS ja kogu tekst võtab endale vajaliku kujunduse. See vähendab ka lehtede kaalu, mis on väga oluline. 
CSS-i kasutamine on soovitatav, kui saidil on palju sama kujundusega lehti. Kõigi lõikude jaoks saate määrata teatud tekstivormingu, kui kirjutate dokumenti paar rida CSS-koodiga. Veebilehe loomisel loovad küljenduskujundajad põhipaigutuse HTML-is, lähtudes Photoshopis loodud küljendusest. Kuid pärast seda näeb sait välja pooleli, peate looma atraktiivse välimuse ja see saavutatakse kaskaadstiililehtedega. Kui teil on palju vaba aega, pole seda raske õppida, kuna kõigi saitide üldilme on ligikaudu sama, saate ühe paigutuse mitme plokiga ja ülejäänud saidid selle järgi "kohandada". Reeglina on kaskaadlaaditabelid palju keerulisemad kui CSS, veelgi keerulisem on saidi paigutus plokkide, mitte tabelite abil. Lisaks võib algstaadiumis tekkida selline probleem nagu saidi erinev kuvamine brauserites. Just selleks, et mitte aega raisata ja veebisaitidel raha teenida, on loodud CMS - valmis veebilehe paigutused, mis võivad olla tasuta või tasulised ning millel on konkreetne haldussüsteem.
Mis on HTML5. Erinevused ja eelisedUus HTML5 standard aitab veebilehtede omanikke ja vabastab nad kohustusest kasutada Adobe Flash-vormingut, aga ka muid programme. Tänu sellele standardile saate muuta lehtedel teksti kuvamist ja lihtsustada teabe sisestamist elektrooniliste vormide täitmisel. Kui jagame kõik selle keele uuendused, võime esile tuua järgmised punktid:
Kui teil on küsimusi, kirjutage need kommentaaridesse, vastame neile hea meelega!
HTML-i põhitõed algajatele, mida peaks nüüd teadma iga algaja veebihaldur või blogija. Kui soovite õppida põhiliste veebisaitide loomist, koodist endast aru saama, teada, mis selle taga on ja mis peaks minema, on seda lihtsalt võimatu teha ilma HTML-keele põhitõdedeta. Minu ajaveebis on terve rida artikleid, mille pühendan sellele teemale A-st Z-ni, kirjeldan iga dokumendis sisalduvat silti, mida see tähendab ja kuidas seda õigesti kasutada.
HTML-i põhitõedKui te ei tea kõige elementaarsemaid asju, on teie tee suletud. Usun, et iga inimene, kes otsustab veebisaite arendada ja luua, peaks teadma ja mõistma põhitõdesid, millest sait ise koosneb, kuidas see töötab ja mis koodis endas toimub.
Muidugi on programmeerimiskeeli üsna palju, need kõik on omal moel keerulised, kuid on ka selliseid, mida on kindlasti vaja teada. Kui soovite posti teel saadetavat kirja kaunilt kujundada, teil on oma VKontakte'i grupp, grupp teistes suhtlusvõrgustikes, sama YouTube'i kanal, peate mis tahes saidi mootorites koodi nuputama, vajate lihtsalt põhimõisteid tundma.
Ma tõin vaid mõned näited, tegelikult on nüüd need teadmised internetis üha sagedamini kasutusel. Olen pigem praktik kui teoreetik, seega näitan oma artiklites selles jaotises teile samm-sammult näiteid, kuidas ja mida tegin. Postitan nii näidislehti kui ka terveid saite.
Html-dokument on lihtsaim tekstidokument, sildistamise keel, mida kohtate Internetis iga päev. Sildid kirjeldavad dokumendi struktuuri. Sildid on vormindatud nurgeliselt< >sulud, mille sisse on kirjutatud sildi nimi. Brauser vaatab dokumendi struktuuri, koostab selle ja kuvab selle vastavalt juhistele teie monitoril, kui muidugi tegite kõik õigesti.
Kogu see protsess algab enne, kui näete valmis pilti. Brauserid töötlevad dokumenti järjestikku algusest lõpuni. Sealhulgas kõik, mis lehel peaks olema. Tabelid, pildid, skriptid ja nii edasi, välja arvatud see, et see hõlmab CSS-i stiile.
Põhitõed algajateleMis on html – kui vaadata, mida Vikipeedia kirjutab – (HyperText Markup Language) dokumentide hüperteksti märgistuskeel. Enamik Interneti-lehekülgi sisaldab selles keeles lehemärgistust. Seda keelt tõlgendavad brauserid ja saadud vormindatud tekst kuvatakse teie arvutimonitoril või mobiilseadmes.
Seda keelt on oma olemuselt väga lihtne ja juurdepääsetav õppida. Igaüks saab õppida ja mõista selle põhitõdesid. Sellise keele kasutamiseks on vaja teada ja kasutada deskriptoreid, mida nimetatakse ka siltideks. Just siltide abil luuakse dokument.
Millest peaks koosnema dokumendi struktuur, millised sildid peaksid olema. Vaatame kõike ühe väikese näitega. Kirjutasin MS Office'is teksti ja näitasin seda sellel ekraanipildil.
Selle teksti kuvamiseks brauseris samal viisil, nagu see oli dokumendis kirjutatud, peate sellele lisama lehe märgistuse, mis sisaldab mõningaid silte. Kõigepealt vaadake neid, siis kirjeldan igaühte, kes mille eest vastutab.
Tere tulemast minu ajaveebi, võtate nüüd HTML-i põhitõdede õppetunni. Kui teile see artikkel meeldis, võite selle ajaveebi tellida, et saada uusi artikleid oma e-posti postkasti.
Jevgeni Nesmelovi ajaveeb! veebisait HTML-i ja css-i põhitõed algajateleMillistest siltidest koosneb iga html-dokument, mida see sisaldab ja kuhu see kõik üles kirjutada?
< html > < body > < h2 >< / h2 > < p >Tere tulemast minu ajaveebi, nüüd tutvuge HTML-i põhitõdede õpetusega. Kui teile see artikkel meeldis, võite selle ajaveebi tellida, et saada uusi artikleid oma e-posti postkasti.< / p > < h2 >Jevgenia Nesmelovi ajaveeb! Nesmelov. ru HTML-i ja CSS-i põhitõed algajatele< / h2 > < / body > < / html > |
Iga kood koosneb nurksulgudesse paigutatud märkidest. Kõiki neid nimetatakse elementideks. Kõik elemendid koosnevad tavaliselt kahest sildist, avanevast ja sulgevast. Soovitan teil alguses silte hoolikalt vaadata; kui mõni neist jääb kahe silma vahele ja seda ei sulge, peate vea leidmiseks suure osa koodist üle vaatama.
Oli juhtumeid, kus kulus rohkem kui üks päev, inimene võtab ühendust ja küsib abi, ta ei leia oma saidilt viga, seega vaadake alati väga hoolikalt, mida ja kuhu kirjutate. Vaatame nüüd selle näite abil iga koodi elementi, mis sinna on kirjutatud, mida see tähendab ja mis lõpuks juhtub.
Enamik silte on seotud, mis sisaldab ava- ja sulgemärgendit. Lisaks sellistele siltidele on olemas ka üksikud sildid. Sildid võivad käia koos teistega, pesades seega üksteise sees. Näiteks kuvage tekst korraga paksus ja kaldkirjas.
Tekst
< strong > < i >Tekst< / strong > < / i > |
Tuletan teile veel kord meelde, et peate järgima dokumendis sisalduvaid reegleid. Nii saab brauser aru lehel olevast, selle järjestusest, sisust jne.
Silt on komponent, mis käsib veebibrauseril teatud ülesannet täita. Näiteks lõigu, tabeli, vormi või pildi olemasolu.
Atribuut – muudab silti. Näiteks saate joondada lõigu keskele või paremale joondatud, määrata ka pildi asukoha lehel jne.
Sulgege sildid ALATI, kui avate, sulgege see kindlasti. Vastasel juhul tekib tõrge ja teie dokumenti ei kuvata lehel õigesti. On ka erandeid, mida ei tasu unustada.
On selgelt vaja mõista, et on olemas dokumendi pealkiri ja selle sisu. Pealkiri on kõik, mis sildis sisaldub. Dokumendi keha (), dokumendi sisu sisaldab kogu lehe sisu. Kui on vaja koodiosa endale jätta, lisades seeläbi need sildid kommentaaridesse, kasutatakse selleks märgendit. Kõik sellise sildi sees olev toimib kommentaarina ja brauserid seda ei taju.
Alustame kõige esimesest. Dokumendi alguses avasin sildi ja lõpus sulgesin. See kood on olemas absoluutselt igas dokumendis; see ütleb brauserile, et kõik nende siltide vahele asetatud on HTML-kood. See on dokumendi juur; kõike, mis on hiljem selle sildi taga, ei lisata enam dokumenti ja brauserid seda ei taju. Dokumendi alguses avatakse silt ja päris lõpus tuleb see sulgeda.
Kogu selle sildi jaotis sisaldab kogu dokumendi tehnilist teavet. Nagu eelmine silt, tuleb ka pea lõpus avada ja sulgeda. See teave sisaldab lehe pealkirja, kirjeldust, otsingumootori märksõnu ja kodeeringut. Kodeerimisest veidi allpool.
Sisu
< head >Sisu< / head > |
See silt sisaldub peas ja see tuleb kirjutada peasildi sisse. See pealkirja märgend on kohustuslik ja peab olema igas HTML-dokumendis. Lisaks sellele kuvatakse see brauseriakna pealkirjana. Sellise päise pikkus ei tohiks ületada 60 tähemärki. Sellise päise tekst peaks sisaldama kõige täielikumat teavet, mis iseloomustab lehe sisu.
Kui kirjutasite päisesse "Tere maailm", siis just seda teavet tuleks lehel kuvada ja mitte muud. Te ei tohiks inimesi ja otsingumootoreid petta, neile see ei meeldi ja sellega teete asja enda jaoks hullemaks. Sellel sildil sisalduv teave peaks olema teie lehe sisuga seotud.
Pärast kohustuslikku pealkirja märgendit on valikuline, kuid sama oluline metasilt. See silt on üksik. Selle sildi abil saate määrata lehe kirjelduse (kirjelduse) ja selle märksõnad (märksõnad).
Lisaks võib metasilt sisaldada andmeid lehe autori ja muude metaandmete atribuutide kohta. Saate takistada kogu lehe otsingumootorite indekseerimist. Määrake leht automaatselt värskendama 20 sekundi või 5 sekundi pärast, millele järgneb üleminek teisele lehele.
< meta name = "robots" content = "index, follow" > < meta http - equiv = "refresh" content = "20" > < meta http - equiv = "refresh" content = "5; url=http://сайт/" > |
Selliseid metaelemente võib olla mitu, kuna need võivad kanda täiesti erinevat teavet. Teised kasutajad, kes avavad lehe brauseris, ei näe kõiki teie kirjeldusi; kõik see jääb vaate eest varjatuks.
Stiilisilti saab kasutada ka lehel stiilide määramiseks. Kui kasutad palju erinevaid css-stiile, siis on soovitav need määrata eraldi faili. Kui teil on vaja neist mitut määrata, saab seda kõike otse html-dokumendis täpsustada.
.base (laius: 100px; taustavärv: #000; kõrgus: 150px; värv: #fff; )
< style type = "text/css" > Base( laius: 100 pikslit; taust - värv : #000; kõrgus: 150 pikslit; värv : #fff; |
Või lisage ühele sildile spetsiaalselt stiile; selleks peate sildi enda sisse lisama stiilielemendi. Seda silti tuleb kasutada konteineris, mis määrab lehe stiilid. Võite kasutada mitut sellist silti, see ei ole viga.
Sarnaselt eelmisele sildile võimaldab lingimärgend määrata stiilid dokumendile, mis on teises failis. Teisisõnu saate olemasolevale dokumendile lisada täieliku css-laadilehe, mis koosneb paljudest omadustest. Seega vähendate dokumendi suurust, mis lõpuks laaditakse ja avaneb madala Interneti-kiirusega arvutis või mobiilseadmes kiiremini.
Saate ühendada rohkem kui ühe faili, piiranguid pole. Sellist silti pole vaja sulgeda. Kui kõik on õigesti tehtud, laaditakse teie dokumenti konkreetsed stiilid eraldi failist. Selle sildi saab lisada html-i põhitõdedele ja ärge unustage selle olemasolu. Tulemuseks on selline pilt:
< link href = "css/style-lg.css" rel = "stylesheet" > < link href = "css/style-md.css" rel = "stylesheet" > < link href = "css/style-sm.css" rel = "stylesheet" > |
Skriptimärgendi abil saate ühendada dokumendiga erinevaid stsenaariume (skripte). Vajalik on sulgemissildi olemasolu. Skript ise võib asuda dokumendi alguses, sees või lõpus.
|
Annab brauserile teada, et kõik nende siltide vahele asetatud teave peaks ilmuma teie brauseriaknas. Siin on peamised sildid, mis võivad olla absoluutselt igas dokumendis. Kehamärgend toimib lehe põhiosana, mis sisaldab kogu selle sisu. Soovitatav on see silt avada ja meeles pidada selle sulgemist dokumendi lõpus.
Lehekülje pealkirjad h1 h2 h3Läheme edasi, näeme silti, mis avaneb ja sulgub samamoodi. See silt tähistab teksti peamist pealkirja; enamikul juhtudel on H1 pealkirja all lehe pealkiri. Tegelikult on ainult kuus andmepealkirja. . Neid kasutatakse ka SEO-s, kuid see on veidi teine teema. Tõstan selle jaoks kindlasti esile ühe artikli ja annan neile üksikasjaliku kirjelduse, tellin ajaveebi värskendused, et te millestki ilma ei jääks.
Selliste pealkirjade olemasolu artiklis mängib lehe reklaamimisel olulist rolli. Lisaks annab nende kasutamine teile selge lehe struktuuri, selle pealkirja, alapealkirjad, esiletõstmised, lõigud jne. Kasutage neid alati ja rakendage praktikas. Paljudes CMS-ides, näiteks WordPressis, näete teksti kirjutades “pealkiri 1”, “pealkiri 2”, “pealkiri 3” ja nii edasi. Nad vastutavad h1, h2 ja h3 eest.
Kui kirjutate uuest lõigust põhiteksti, kirjutate sildi
Alguses ja lõpus sulgege
. Lõigu märkimine html-is võrdub uue lõigu loomisega MS Wordi dokumendis. Ma ei lisanud dokumendile midagi uut. Kuid see pole veel kõik, mis peaks html-dokumendis olema. Vaatame teist näidet, kirjeldus tuleb veidi hiljem.HTML dokument
See tekst on paksus kirjas, ja see on ka kaldkirjas
< ! DOCTYPE html > < html > < head > < meta http - equiv = "Content-Type" content = "text/html; charset=utf-8" / > < title >HTML dokument< / title > < / head > < body > < p > < b > < / b > < / p > < / body > < / html > |
Iga dokument sisaldab pea- ja pealkirjaelementi. Esimene, mis tuleb kohe pärast esimest silti. See silt sisaldab kogu teavet lehe kohta, sisaldab ka elementi. Pealkiri – info lehe pealkirja kohta ehk teisisõnu lehe pealkiri, selle nimi. Pealkirjas märgite selle lehe õige nime, mille järgi kasutaja teid otsingumootori kaudu otsib, mis on väga oluline punkt. Mõlemad elemendid peavad olema avatud ja ka suletud. Iga element on suletud "/" märgiga. Tulemuseks on selline pilt.
Pealkiri ja lehe sisu
| < / html > |
Nagu näete, pole midagi keerulist. Siin on kõige lihtsamad sildid, mis peaksid olema igas html-dokumendis. Ärge unustage neid kõiki sulgeda, vastasel juhul ei suuda brauser koodi täielikku pilti tajuda. Peate seda alati teadma ja meeles pidama. Seejärel hakkate sisestama teksti, pilte, videoid jne. Kuid see on juba teistes artiklites.
Notepad++ redaktor
Koodiga töötamiseks kasutage programmi Notepad++. See on tasuta ja seda pole Internetist keeruline leida. Väga mugav mis tahes koodi mõistmiseks, see kuvab mugavalt ka avamise ja sulgemise sildid. Toetame enam kui 40 programmeerimiskeele süntaksit. Just see, mida vajate html-i põhitõdede õppimiseks.
Märkmik on igas mõttes parem kui tavaline märkmik. Maksimaalse mugavuse, lihtsuse ja õppimise huvides tuleb see redaktor algselt teie arvutisse installida. Kõige olulisem eelis ja mugavus on see, et Notepad++ redaktor näitab koodi kirjutamisel vihjeid, mis muudab teie töö palju kiiremaks ja kvaliteetsemaks.
DOCTYPE elementIga dokument peab sisaldama ka järgmist doctype elementi. Miks seda vaja on ja mis selles peaks olema. Tavaliselt inimesed nende liinide vastu väga ei kiida, kopeerivad need oma dokumentidesse ja töötavad rahulikult. Need elemendid ütlevad brauserile, millist html-i versiooni dokumendis kasutatakse, milline on lehe kirjeldus, millist kodeeringut kasutatakse, millised märksõnad on kaasatud, kes on autor ja kuidas lehekülge nimetatakse.
Tavaliselt asetatakse need kohe algusesse. Võimalusi on mitu ja need kõik erinevad üksteisest, kirjutan ühe näite, mida kõige sagedamini kasutatakse. Seda toorikut saab kasutada valmis mallina. Järgmisena on iga rea selge kirjeldus, sellega ei tohiks probleeme tekkida.
Lühidalt selges keeles html-i põhitõdedest: See rida ütleb brauserile, et see dokument on XHTML versioon 1.0, kasutatakse inglise keelt ja kogu see segadus asub sellel aadressil. Järgmisena märgime metasildis kasutatava kodeeringu. Kõige sagedamini kasutatav on Windows 1251.
Kirjeldus - puudutatakse SEO teemat, mis on üks kolmest peamisest sildist, mis peab olema absoluutselt igas dokumendis; see silt näitab lehe kirjeldust. Sellel lehel kirjutatu, lühike kirjeldus, mitte rohkem kui kaks lauset. Märksõnade silt hõlmab ka SEO teemat, see silt on kohustuslik. See sisaldab märksõnu, mida Interneti-kasutajad kasutavad teie otsimiseks otsingumootorite kaudu.
Pealkirjasilt sisaldab dokumendi enda nime, selle pealkirja, mida näeme brauseris. Tõenäoliselt kõige olulisem silt kogu dokumendis, millel on kõige suurem mõju lehe reklaamimisele. Artiklis lisamise ja kujundamise kohta kirjeldatakse seda silti üksikasjalikumalt.
Mida peate sellest html-i põhitõdede õppetunnist meeles pidama:
Kõigile põhilehtedele tuleks alati anda nimi register. Nii on see aktsepteeritud ja sellega on kõik harjunud, olgu faililaiend mis tahes, see võib olla html või php. Seda nimetatakse alati nii.
Vaadake Webformyselfi videot HTML-i põhitõdede kohta.
Hüperteksti märgistuskeel, põhielemendid ja struktuur. Seda kõike ja palju muud püüan ka oma blogis kirjeldada. Kõigepealt kirjutatakse kasulikku teavet algajatele, antakse koodinäide ja antakse võimalus näide ise koos valmis lehega alla laadida.
Kaasaegne maailm peab HTML-i tekkimise eest tänama üht teadlast Euroopa Tuumauuringute Nõukogus (Conseil Européen pour la Recherche Nucléaire, CERN). Selle teadlase nimi on Timothy John Berners-Lee. HTML-i esimene versioon loodi teadusdokumentide vormindamiseks. See on struktuurne vormindamine ilma värviskeemide, fondiparameetrite jms kirjeldamise elementideta. Seega võimaldas HTML algselt tekstis esile tõsta pealkirju, lõike, loendeid ja sarnaseid struktuurielemente. HTML-i töötlemise või "esitamise" tulemus ei tohiks sõltuda selle visualiseerimise riistvara tehnilistest omadustest, kuna see ei sisaldanud selle visualiseerimise parameetreid. Aja jooksul kadus see hüperteksti märgistuskeele funktsioon osaliselt.
Niisiis pärineb HTML-i esimeste versioonide ilmumine aastast 1986 ja 1991. aastal täiustati HTML-i oluliselt ja seda hakati kasutama spetsiaalselt hüperteksti edastamiseks kogu veebis. Nad ütlevad, et maailmakuulus lühend HTML, mis tähistab Hyper Text Markup Language, ilmus täpselt eelmise sajandi 90ndate alguses. Ja nüüd lühike ekskursioon märgistuskeelte sugupuusse. Hüperteksti märgistuskeele HTML esimene versioon loodi standardse üldistatud märgistuskeele (SGML) põhjal, mida võib mingil moel pidada laiendatava märgistuskeele prototüübiks. XML-standard on meie aja jooksul saavutanud tohutu populaarsuse selle arvutitehnoloogias kasutatavate laienduste arvukuse tõttu. Lugeja täielikuks segadusse ajamiseks lisan kohe, et hiljem töötati XML-i põhjal välja hüperteksti märgistuskeel XHTML (Extensible Hypertext Markup Language), mis sisuliselt kordab HTML-i. Sellest tulenevalt on meil akronüümid SGML, HTML, XML ja XHTML ning me peame mõistma, kumb on kumb. Tegelikult on kõik lihtne: SGML pole midagi muud kui reeglite kogum, mille alusel saab üles ehitada mis tahes märgistuskeele. HTML on üks neist keeltest - SGML-rakendus. Teisisõnu, SGML määratleb, millised märgistuselemendid peaksid välja nägema, ja HTML määrab, millised elemendid täpselt peaksid olema ja kuidas brauserid peaksid neid tõlgendama. XHTML on omakorda XML-i rakendus ja XML ise pole midagi muud kui SGML-i lihtsustatud versioon. Vaatamata sellele, et need on välimuselt väga sarnased, on neil olulisi varjatud erinevusi, mis enamasti seisnevad nende töötlemise põhimõttes.
Nüüd pöördume tagasi HTML-i arendamise ajaloo juurde. Seega kasutati kuni 1994. aastani HTML-i ainult andmete struktuurseks märgistamiseks, kuigi see sisaldas juba silte rasvases või kaldkirjas teksti esiletõstmiseks. Samal 1994. aastal loodi W3C (World Wide Web Consortium) organisatsioon - World Wide Web Consortium, mida juhib täiesti loogiliselt sama Tim Berners-Lee ja 1995. aastal avaldati HTML 2.0 soovitus. HTML-i loojad mõistsid juba, et aja jooksul areneb nende vaimusünnitus staatilise teksti märgistamise keelest dünaamiliste Interneti-ressursside loomise peamiseks tööriistaks. HTML 2.0 peamine lisand oli vormide ilmumine keele osana koos kasutaja juhtelementide komplektidega, mida pidi kasutaja kasutama HTTP-päringute parameetrite sisestamiseks.
Pärast teise versiooni väljaandmist algas kohe töö järgmise põlvkonna HTML-iga. 1997. aastal ilmus HTML 3.2 soovitus, mis täiendas märgistuskeelt tabelite, raamide, piltide ja mõne muu olulise märgistusega. Kuid 3. versiooni kõige olulisem saavutus on see, et selle autorid pöördusid uuesti brauseris märgistuse visualiseerimise probleemi juurde, pidades meeles, et HTML peaks märgistama ainult dokumendi struktuuri ja ei tohiks otseselt sisaldada graafiliste stiilide parameetreid elementide kuvamiseks brauser. Nende HTML 3.2-ga töötamise tulemuseks oli sõltumatu CSS-keele (Cascading Style Sheets) tekkimine - kaskaadlaaditabelid, mille koodi saab nüüd ühendada HTML-i märgistuskoodiga ja seeläbi kohandada lehe välimust.
HTML-i 4. versiooni avaldamisega 1997. aastal olid W3C töötajad vabastanud oma vaimusünnitusest tarbetutest elementidest, mis CSS-i tulekuga olid vananenud ja seadsid ohtu idee eraldada struktuuri märgistus esitluse parameetritest. Kuid keegi ei blokeeriks selliste pisiasjade pärast uut versiooni. HTML 4.0 soovituste peamine saavutus oli leheobjekti mudeli (Document Object Model, DOM) ilmumine, mille elemente sai nüüd manipuleerida brauserite käivitatavate skriptimiskeelte kaudu. Kõige populaarsem selline programmeerimiskeel on JavaScript. HTML pluss DOM pluss JavaScript võrdub dünaamilise HTML-iga või lihtsalt DHTML-iga, mis tähistas läbimurret veebikujunduses. Nüüd võivad laaditud Interneti-lehe elemendid muuta oma välimust vastuseks kasutaja tegevusele, samuti lisada uusi ja kustutada olemasolevaid elemente. 24. detsembril 1999 anti välja hüperteksti märgistuskeele 4. versiooni HTML 4.01 uusim väljaanne.
HTML5 ei ole veel saanud ametliku W3C soovituse staatust, kuid juba on selge, et HTML-i autorid jätkavad tööd dokumendiobjektide mudelite toe ja JavaScripti tõlgendamise nõuete väljatöötamiseks. Kuigi HTML5 saab mitmeid uusi silte, puudutab enamik soovitusi siiski brauseri käitumist DHTML-i kontekstis: sisse on ehitatud pukseerimisfunktsioonide tugi, võimalus joonistada virtuaalsele lõuendile. , hallata sirvimisajalugu ja jagada sõnumeid lehtede vahel, salvestada täitmise konteksti ja palju muud. Uute HTML-i soovituste avaldamisega loodetakse järk-järgult kaduda probleemid brauseritevahelise ühilduvuse puudumisest, kui sama JavaScripti koodi täidetakse erinevate brauserite all erinevalt. Jätkub ju trend määratleda nõuded objektimudeli ja JavaScriptiga töötamiseks ning brauseri arendajatelt nõutakse (kui nad soovivad, et nende tarkvaratooteid kasutataks) neid nõudeid järgima.
HTML5 on kavas avaldada 2014. aastal. Võib-olla on W3C selleks ajaks välja töötanud eraldi soovitused, mis puudutavad ainult JavaScripti programmeerimist, ja HTML muutub lõpuks taas ainult dokumendi struktuuri märgistuskeeleks. Hoolimata asjaolust, et täna on alles 2012. aasta, toetavad paljud juba populaarseimad brauserid. Paljugi, mida veebidisainerid varem pidid üksi tegema (sama lohistamine), toetatakse HTML5 väljalaskmisega brauseri tasemel ja see sündmuste areng ei saa muud üle kui rõõmustada. Jääb vaid loota, et trend jätkub.
Internet on ülemaailmne võrk, mis ühendab arvutivõrke üle maailma ühtsete tüüplepingute (protokollide) alusel teabevahetuse meetodite ja ühtse adresseerimissüsteemi alusel.
Tänaseks on Internet saavutanud enneolematu populaarsuse. Ekspertide sõnul ühendab Internet rohkem kui 100 miljonit arvutit. Internetiteenuseid kasutab enam kui 300 miljonit inimest 170 riigis.
Funktsionaalsest vaatenurgast on Internet:
ü odav ja kiire suhtlusvahend abonentide vahel üle kogu maailma;
ü enneolematu teabehoidla mis tahes teadmiste valdkonna kohta;
ü uus perspektiivne tegevuskeskkond.
Interneti mõju ei laiene mitte ainult arvutiside tehnoloogilisele valdkonnale, vaid sellel on ka sotsiaalne suunitlus ja see läbib kogu ühiskonda, kuna üha enam levivad operatiivsed teadmiste hankimise vahendid ja elektrooniline kaubandus.
Tänapäeval on kõige levinum ja populaarseim Interneti-teenus WWW (World Wide Web). Infot WWW kohta esitatakse nn hüperteksti (või laiemalt hüpermeedia) dokumentide kujul, mis võivad sisaldada vormindatud teksti, graafikat, heli- ja videofragmente.Hyperteksti dokumentide põhiomaduseks on aktiivsete tsoonide olemasolu, mis on tundlikud hiireklõpsu suhtes Tekstifragmendid võivad olla aktiivsed , terved pildid ja nende osad, aktiivsel tsoonil klõpsamine põhjustab selle tsooniga seotud (siht)dokumendi allalaadimise.
Materjalide Internetti postitamise õppimiseks peate esmalt tutvuma hüperteksti märgistuskeelega HTML (H yperT ext M arkup L Anguage)
HTML-i põhitõedHüperteksti dokumentide HTML märgistuskeel on käskude komplekt, mida nimetatakse siltideks (inglise keelest silt). Dokumendi tekstist leitud HTML-märgendeid tõlgendab brauser dokumendi kuvamisel.
HTML-dokumentide vaatamine toimub programmide abil - brauserid(inglise keelest brauser), mis kuvavad dokumendi vastavalt HTML-märgistusele ja pakuvad hüperlinkide navigeerimist. Levinumad brauserid on Microsoft Internet Explorer ettevõttelt Microsoft Corporation ja Netscape Navigator ettevõttelt Netscape Communications Corporation.
Kuna HTML-dokument on tekstifail, saab seda ette valmistada lihtsas tekstiredaktoris, näiteks Notepad ( Märkmik), kuid see on väga töömahukas. Sagedamini kasutavad nad spetsiaalselt HTML-dokumentide ettevalmistamiseks loodud spetsiaalseid redaktoreid, mis võimaldavad tööriistariba nuppude või menüükäskude abil lisada silte ja määrata dialoogiboksides sildi atribuute, näiteks Macromedia Dreamweaver, Microsoft FrontPage, HomeSite jne.
HTML-dokumendi saab hankida, teisendades selle HTML-vormingusse, näiteks Microsoft Office'i dokumendivormingust. Tuleb märkida, et sellise teisenduse korral osutub HTML-dokumendi lähtetekst äärmiselt üleliigseks ja vajab parandamist, palju tõhusam on kasutada spetsiaalseid HTML-i redigeerijaid.
HTML-i sildi süntaksHTML-märgend kirjutatakse nurksulgudesse (märgid) ja koosneb nimest, millele võib järgneda atribuutide loend (enamiku siltide puhul valikuline). Nimed ja atribuudid on ingliskeelsed sõnad ja lühendid.
Sildid võib jagada kahte rühma:
Paaritud sildid (nimetatakse ka konteinerid) koosneb kahest komponendist: avamine (esialgne) ja sulgemine (lõplik); sulgev komponent on sama nimega, kuid kirjutamisel on nime ees kaldkriips (sümbol / ). Dokumendi tekst ja muud sildid võivad asuda avamise ja sulgemise komponendi vahel. Konteinerisildi ava- ja sulgemiselementide vahel paikneva dokumendifragmendi vormistab brauser vastavalt sildi tähendusele, näiteks kuvatakse siltide vahel asuv tekst paksus kirjas (sildi nimi on inglise keelest julge). Paaritud sildid võivad olla pesastatud, kuid ei tohi kattuda.
Sidumata sildid (nimetatakse ka autonoomne) ei oma lõppkomponenti Nende tõlgendamisel sisestatakse kuvatavasse dokumenti üks või teine objekt. Näiteks silt , mis esineb HTML-dokumendi tekstis, põhjustab faili pict.gif graafilise pildi sisestamise.
Loendis olevad atribuudid on üksteisest eraldatud ühe või mitme tühiku või tabeldusmärkide või reavahetusmärkidega, atribuutide kirjutamise järjekord pole oluline. Enamikku atribuute kasutatakse paarina atribuudi nimi = atribuudi väärtus. Kui atribuudi väärtus on rohkem kui üks sõna või üks arv, tuleks see lisada ühe- või topeltjutumärkidesse. Atribuute ei täpsustata siltide sulgemiskomponentides.
Siin on näide atribuutidega sildist:
|
Sildi nimi Atribuudi nimi |
|
Atribuudi väärtus |
|
Atribuudi nimi |
|
Atribuudi väärtus |
Tere !
Olles kohanud sellist sildi HTML-dokumendis, tõlgendab brauser seda, kuvades märgendile järgneva teksti põhisuuruse suhtes suurendatud tähemärkidena (SIZE=+2) ja punase värviga (COLOR=RED); seda tekstivormingut rakendatakse kuni sulgeva sildi leidmiseni.
Märgendi ja atribuudi kirjete tähemärkide suurtähtedel pole tähtsust.
HTML-dokumendi struktuurHTML-dokument on ümbritsetud siltidega ja. Nende siltide vahel on kaks jaotist: päiseosa (ja siltide vahel) ja dokumendi kehaosa (märgendite ja vahel). Päise jaotis sisaldab parameetrite kirjeldust kasutatakse dokumendi kuvamisel, kuid ei kajastu otse brauseriaknas .Dokumendi kehaosa sisaldab põhiteksti, mis on mõeldud brauserile kuvamiseks, vormindussildid, piltide paigutused, tabelid, hüperlingid jne.
Internetti postitamiseks sobiva lihtsaima dokumendi HTML-kood näeb välja selline:
< TITLE >Meie esimene lehtTITLE >
Lihtsaim HTML-dokument
Selle koodi saab sisestada Notepadi tekstiredaktorisse ja salvestada failina laiendiga . htm või. html – sel juhul avaneb dokument teie arvutisse installitud vaikebrauseris. Brauser kuvab selle dokumendi, kuvades selle aknas rea "Lihtsaim HTML-dokument", mis asub dokumendi põhiosas. Brauseri tiitliribale ilmub fraas "Meie esimene leht".
HEAD sektsioonPäisejaotis sisaldab tavaliselt silte, mis on kasutajale nähtamatud, kuid võivad siiski aktiivselt mõjutada dokumendi välimust.
|
Tag |
Eesmärk |
|
Määrab kogu dokumendi nime. Nimi kuvatakse tavaliselt brauseriakna tiitliribal. See element on vajalik iga HTML-dokumendi jaoks ja seda ei saa määrata rohkem kui üks kord. |
|
|
Määrab praeguse dokumendi baasaadressi (URL), mis on lähtepunktiks suhteliste URL-ide arvutamisel dokumendis. Elemendil ei ole lõpumärgendit. Esineda peab vähemalt üks argumentidest: HREF – määrab praeguse dokumendi baasaadressi (URL). SIHT – määrab raami nime, mida vaikimisi hüperlinkides kasutatakse. See võib olla kasulik, kui soovite avada kõik dokumendi lingid teises raamis. |
|
|
< STYLE TYPE= "text /css " > |
Kasutatakse kaskaadlaadilehtede (CSS – Cascade Style Sheet) sisestamiseks dokumenti. TYPE on kohustuslik atribuut, mille väärtus on tavaliselt "text/css". |
|
< МЕТА …> |
META elementi kasutatakse dokumendi tehniliseks kirjeldamiseks. Selle elemendi abil sisestatakse dokumendi pealkirja täiendavat kasulikku teavet, mis on kasutajale nähtamatu, kuid mõnikord lihtsalt asendamatu teie lehe korrektseks indekseerimiseks otsinguserveri robotite poolt. Elemendil ei ole lõpumärgendit. NIMI – määrab metapostituse nime. Eelmääratletud nimesid on palju, mõnda neist näete allolevas näites. CONTENT – määrab väärtuse parameetris NAME määratletud metakirjele. |
See jaotis sisaldab veebilehe põhisisu – dokumendi teksti, pilte, tabeleid jne. Element BODY ei tohi dokumendis esineda rohkem kui üks kord ja see võib sisaldada järgmisi atribuute:
|
Atribuudi süntaks |
Eesmärk |
|
MARGINHEIGHT= number |
Määrab dokumendi ülemise ja alumise veerise laiuse (pikslites). Töötab ainult Netscape'i brauserites |
|
TOPMARGIN= number |
Määrab dokumendi ülemise ja alumise veerise laiuse (pikslites). Töötab ainult Internet Exploreri brauserites |
|
MARGINWIDTH= number |
Määrab dokumendi vasaku ja parema veerise laiuse (pikslites). Töötab ainult Netscape'i brauserites |
|
LEFT MARGIN= number |
Määrab dokumendi vasaku ja parema veerise laiuse (pikslites). Töötab ainult Internet Exploreri brauserites |
|
TAUST= URL |
Määrab pildi, mis "täidab" tausta (taustapilt). Väärtus määratakse pildi absoluutses või suhtelises aadressis (vt jaotist Piltide paigutamine) |
|
BGCOLOR= värvi |
Määrab dokumendi taustavärvi. MicrosoftInternetExplorer toetab 16 standardset värvinime (vesi, must, sinine, fuksia, hall, roheline, laim, maroon, tumepunane, oliiv, lilla, punane, hõbe, sinine, kollane, valge) Teine võimalus on kasutada värvikoodi kuuekohalise kuueteistkümnendsüsteemi kujul, mis määrab punase (kaks esimest numbrit), rohelise (kaks järgmist numbrit) ja sinise (kaks viimast numbrit) komponendi intensiivsuse. Iga komponendi intensiivsus kuueteistkümnendsüsteemis on vahemikus 00 kuni FF. Märgendi atribuudiväärtusena värvi määramisel eelneb kuueteistkümnendsüsteemi numbrile # märk. Näiteks kirje COLOR = "#0000 FF" tähendab sinist Vaatamata põhimõttelisele võimalusele määrata miljoneid värve, tuleb arvestada, et brauserid kuvavad ainult 256 värvi ja igal brauseril on oma värvipalett.Selles paletis valib brauser määratud värvile lähima värvi |
|
TEKST= värvi |
Määrab dokumendis oleva teksti värvi |
|
LINK= värvi |
Määrab dokumendis olevate hüperlinkide värvi |
|
ALINK= värvi |
Määrab klõpsamisel hüperlinkide esiletõstmise värvi. |
|
VLINK |
Määrab juba vaadatud dokumentide hüperlinkide värvi |
Kõigil märgivormingu siltidel on nii ava- kui ka sulgemiskomponent ning need toimivad nende vahele jääva teksti järgi.
Peamine silt on ... FONT>, mida tuleb kasutada ühe või mitme atribuudiga, mis muudavad fondi suurust, värvi ja kirjatüüpi:
|
Atribuudi süntaks |
Eesmärk |
|
SUURUS = tähenduses |
Suurus määratakse kas absoluutväärtusena (arv 1 kuni 7) või põhifondi suuruse suhtes (kujul +n või -n). |
|
VÄRV= värvi |
Värv |
|
NÄGU = fontide loend |
Kirjatüübid teksti kuvamiseks; nimed on loetletud eelistuste järjekorras, eraldades need komadega, nt FACE="Verdana, Helvetica, Arial, Sans-Serif" Saate määrata ka ühe kirjatüübi, kuid pidage meeles, et seda fonti ei pruugita kasutaja arvutisse installida ja brauser ei kuva "eksootilisi" fonte |
Lisaks kasutatakse silte märkide stiili muutmiseks:
. .. (inglise keelest bold) − paksus kirjas;
.. . (inglise keelest kursiiv) - kaldkiri;
... (inglise keelest TeleType) – monospace font;
... (inglise keelest allajoonitud) - alla joonitud;
... S > (inglise keelest s trike läbi) - läbi kriipsutatud;
... (inglise keelest sub stsenaarium) – indeks;
... (inglise keelest sup erscript) on ülaindeks.
Tekst siltide vahel
ja (inglise keelest pre vormindatud), kuvatakse nii, nagu see oli eelvormindatud, kõigi tühikute ja reavahedega.
Lõigete vormindamineTekst kuvatakse brauseriaknas sõnahaaval, akna parema servani jõudmisel liigutatakse järgmine sõna automaatselt uuele reale. Isegi kui lehe koodi sisestati mitu tühikut või kirjutati tekst uuele reale, ei kuvata neid toiminguid brauseris vaadates. Seetõttu peate tekstis järjestikuste tühikute või mitme tühja rea kuvamiseks kasutama erinevaid silte.
Tag
(inglise keelest b reak) katkestab tekstivoo ja lisab uue rea uut lõiku loomata. Mitu järjestikust silti
tõlgendatakse mitme tühja reana. Reavahe on üks. Märgendil pole sulgevat komponenti ega atribuute.
Tag (inglise keelest lk aragraaf)algab lõiku; uus lõik eraldatakse eelmisest kahekordse reavahega. Lõige ei tohi olla tühi, see tähendab mitut järjestikust silti
tõlgendatakse ühena (erinevalt sildist
).Suletav komponent
valikuline, kuna eelmine lõik lõpeb seal, kus uus algab. Märgendil on valikuline atribuut ALIGN, mis näitab lõigu joonduse tüüpi, mis võib võtta väärtusi LEFT, CENTER, RIGHT ja JUSTIFY, täpsustades vastavalt vasakule joonduse, keskele, paremale ja laiusele. Samuti tsentreeritakse märgenditesse lisatud tekst.
...Kui sulgev komponent
välja jätta, säilib määratud joondustüüp kuni järgmise joonduse määrava sildini või kuni dokumendi lõpuni.
HTML võimaldab teil luua lõike, mis on vormindatud nummerdatud või täpploenditena. Tekstifragment, mis on loend, sisaldub siltides:
järjestatud (nummerdatud) nimekiri (inglise keelest o tellitud l ist)
järjestamata (täppidega) nimekiri (inglise keelest u norderdas l ist)
Järjestatud või järjestamata loendi iga element on ümbritsetud siltidega ... (inglise keelest l ist i tem). Teksti kuvamisel paigutatakse iga loendi element uuele reale, mida tähistab number või marker. Lisaks võib loendil olla pealkiri, mis määratakse sildi abil (inglise keelest l ist h kõrv). Sulgemissildid pole vajalikud.
|
Nummerdatud loend |
Täpploend |
|
|
Koodi element |
< O L> Pealkiri Esimene element Teine element Kolmas element |
< U L> Pealkiri Esimene element Teine element Kolmas element U L> |
|
Brauseri ekraan |
Pealkiri 1. Esimene element 2. Teine element 3. Kolmas element |
Pealkiri · Esimene element Teine element · Kolmas element |
Mitmetasandilist loendit saab korraldada nummerdatud ja täpploendite kombinatsiooni kaudu.
Märgendil on valikulised atribuudid:
|
Atribuudi süntaks |
Eesmärk |
|
|
TÜÜP = vormingus |
Nummerdamisvormingus võivad olla järgmised väärtused: |
|
|
araabia numbrid (vaikimisi) |
||
|
suured tähed |
||
|
väiketähtedega |
||
|
suured rooma numbrid |
||
|
väikesed rooma numbrid |
||
|
START = väärtus |
esimene number loendis (vaikimisi 1) |
|
Märgendil on valikuline atribuut
|
Atribuudi süntaks |
Eesmärk |
|
|
TÜÜP = vormingus |
Märgi vormingul võivad olla järgmised väärtused: |
|
|
Plaat |
ketas (vaikimisi) |
|
|
Ring |
ring |
|
|
Ruut |
Ruut |
|
Lõike saab vormindada ka tasemepealkirjadena (alates n = 1 kuni n = 6), selleks kasutatakse silte kujul ... n>. Esimese taseme pealkiri kuvatakse suurimas kirjas.
Sildid
, ... ,
sellel võib olla joondusatribuut ALIGN väärtustega LEFT, RIGHT ja CENTER.
Jooniste paigutusPildid, mida brauser veebilehe vaatamisel kuvab, salvestatakse eraldi failidesse gif, jpg (jpeg) või png formaadis ning lehe koodis tehakse link soovitud failile. Selleks kasutatakse sidumata silti, millel on üks kohustuslik ja mitu valikulist atribuuti.
|
Nõutav atribuut: |
|
|
SRC = url |
Graafilise faili aadress (suhteline või absoluutne) |
|
ALT= tekst |
Alternatiivne tekst, mis kuvatakse brauserirežiimis ilma pilte laadimata (peab olema jutumärkides) |
|
PIIR = tähenduses |
Ääriste paksus pikslites, 0 tähendab, et äärist pole (vaikimisi) |
|
BORDERVÄRV = värvi |
Määrab äärise värvi |
|
KÕRGUS = tähenduses |
Pildi kõrgus pikslites (vaikimisi originaal) või protsendina brauseriakna kõrgusest |
|
LAIUS = tähenduses |
Pildi laius pikslites (vaikimisi originaal) või protsendina brauseriakna laiusest |
|
HSPACE = tähenduses |
Vaba ruum pildist vasakul ja paremal pikslites |
|
VSPACE = tähenduses |
Vaba ruum pildi kohal ja all pikslites |
|
JOONDA = tähenduses |
Joondab pildi horisontaalselt. Kui on määratud LEFT või RIGHT, joondatakse pilt vastavalt horisontaalselt, nende väärtuste määramine põhjustab teksti ümber pildi keerdumise |
Vaatame lähemalt faili adresseerimise absoluutseid ja suhtelisi meetodeid.
Pöördumine absoluutsel kujul kasutatakse, kui viidatakse teistes serverites asuvatele ressurssidele. Universaalset aadressi, mis määrab teaberessursi asukoha, nimetatakse URL-iks (Uniform Resource Locator). URL koosneb kahest osast, mis on eraldatud kooloniga. Esimene osa näitab võrguprotokolli tüüpi, mis sõltub ressursi tüübist. Näiteks kui ressurss asub WWW-serveris, on see protokoll http.Teine osa sisaldab domeeninimesüsteemis oleva arvuti (serveri) nime ja (vajadusel) faili tee nime. Teenime kirjutamisel eraldatakse katalooginimed faili- ja katalooginimedes kaldkriipsuga (märk /) teha vahet suur- ja väiketähtedel, tühikud pole lubatud. Siin on näited URL-idest:
http://www. vshu. kirov .ru/ site / images / picture 1. jpg
http://195.21.123.13:8110
ftp://everything.com/soft/prog.zip
mailto:See e-posti aadress on spämmirobotite eest kaitstud. Selle vaatamiseks peab JavaScript olema lubatud.
Viimane URL, mis osutab protokollile mailto ja e-posti aadress ei viita ühelegi teabeallikale; See on ainus URL-i tüüp, mis ei sisalda pärast koolonit kahte kaldkriipsu.
Piltide adresseerimist absoluutsel kujul veebilehe loomisel praktiliselt ei kasutata.
Pöördumine suhtelises vormis kasutatakse, kui viidatakse samas serveris asuvatele ressurssidele. Faili tee kirjutamisel eraldatakse kataloogide nimed kaldkriipsuga (sümbol /), failisüsteemi kataloogides ühe taseme võrra ülespoole liikumine on tähistatud kahe punktiga (sümbolid ..). Selguse huvides kujutlege näiteks arvutit, mille kataloogi struktuur sisaldab HTML-faile:
SHAPE\* MERGEFORMAT
|
MinuSait |
|
Leheküljed |
|
Pildid |
|
Lehekülg1.htm Lehekülg2.htm Pilt1.jpg Pilt2.jpg |
|
Index.htm Pilt.jpg |
Sel juhul on IMG-sildi kirjutamiseks võimalikud näiteks järgmised valikud:
ü < IMG SRC = Picture . jpg >(Pilt . jpg pilt asub Index . htm lehel)
ü < IMG SRC = Images / Pict 1. jpg >(pilt Pilt 1. jpg asub lehel Indeks. htm)
ü < IMG SRC =../ Picture . jpg >(Pilt . jpg pilt asub lehel Lk 1. htm )
ü < IMG SRC =../ Images / Pict 1. jpg >(pilt Pilt 1. jpg asub lehel Lk 1. htm)
Hoolimata asjaolust, et formaalselt on nõutav ainult SRC atribuut, on praktikas vaja määrata ka alternatiivne tekst (ATribuut ALT), kuna paljud inimesed töötavad brauseriga režiimis ilma pilte laadimata.
Joonise kuvamisala kõrgus ja laius määratakse laiuse ja kõrguse atribuutide abil pikslites või protsendina ekraani suurusest. Kui üks neist atribuutidest on määratud, kohandatakse joonist nii, et selle kõrgus või laius vastaks määratud atribuudile. Teine suurus määratakse automaatselt, sobivas proportsioonis. Ainult ühe atribuudi rakendamine muudab joonise mõlemat mõõdet.
Kui määrate selgesõnaliselt mõlemad atribuudid, skaleeritakse pilti piki kahte telge vastavalt määratud mõõtmetele. Kõrguse ja laiuse atribuudid ei muuda pildi laadimisaega, vaid ainult selle välimust (suurust) ekraanil.
Hüperlink on objekt (tekst, pilt, pildifragment), mis hiirega klõpsates viib uue dokumendi või dokumendifragmendini. Just hüperlingid võimaldavad teil korraldada üleminekuid mis tahes Internetti postitatud dokumentide vahel.
Teksti hüperlingidSeos HTML-dokumentide ja dokumendifragmentide vahel korraldatakse sildi abil ...(inglise keelest a chhor – ankur).
Märgendit kasutatakse nii teise dokumendi lingi loomiseks kui ka dokumendi fragmendi linkimiseks.
|
Nõutav atribuut: |
|
|
HREF = url |
Sihtdokumendi aadress (võib esitada absoluutsel ja suhtelisel kujul) |
|
Põhilised valikulised atribuudid: |
|
|
NAME=" Nimi" |
Märgib vahele jäävat< A >ja A > dokumendi fragment kui võimalik linkobjekt. Väärtusena peate ladina keeles kirjutama mis tahes selle dokumendi jaoks ainulaadse indekssõna. Näiteks Section1 silt loob nn sildi (järjehoidja), et minna jaotisse 1. Sel juhul saate märgitud alale viidata, märkides lihtsalt dokumendi nime järel selle nime (eelneb #). Niisiis,<
A
HREF
="
Index
.
html
#
part
1">1. osasse A > viib teid registrifaili jaotisesse 1. osa. html ja |
|
SIHT = " nimi" |
Sihtdokumendi kuvamise raami (raami) või akna nimi. Seda atribuuti kasutatakse ainult koos HREF-parameetriga. Väärtus peab olema kas ühe olemasoleva kaadri nimi või üks järgmistest reserveeritud nimedest: _self – näitab, et parameetris HREF määratud dokumenti tuleks kuvada praeguses kaadris; _blank – määrab, et dokument tuleb kuvada uues aknas |
|
TITLE= " tekst!}" |
Kuvab kohtspikri, kui hõljutate kursorit hüperlingi kohal |
Siltide vahele asetatud tekst ja pildid muutuvad dokumendi aktiivseks alaks, mis on tundlik hiireklõpsu suhtes, mis põhjustab sihtdokumendi laadimise. Hüperlingi tekst on esile tõstetud allakriipsutusega ja värvidega, mis on määratud sildi atribuutide LINK, A LINK, V LINK väärtusena (või vaikevärvina).
Hüperlingid-pildidTerve pildi hüperlingiks muutmiseks võite kasutada ka silti ...., ainult teksti asemel (või koos tekstiga) vahel< A >ja A > silt asub< IMG …>koos kõigi asjakohaste atribuutidega.
Näiteks , .
Hüperlingi kaartSilt võimaldab muuta aktiivseks tsooniks tekstifragmendi või terve pildi; Selleks, et ühe pildi erinevad fragmendid saaksid linkida erinevate sihtdokumentidega, peate kasutama kaardipilti rakendavat silti.
Konteineri märgendi puhul on ainus nõutav atribuut NAME , mille väärtuseks on nimi (näiteks NAME=" mymap " , mida tuleb kasutada IMG sildi USEMAP atribuudi kirjeldamisel, mis kirjeldab pilti, mis on mõeldud kasutamiseks kaart (numbriga # − USEMAP="#mymap")
Konteineris peab igal pildi hiiretundlikul alal olema märgend järgmiste atribuutidega:
|
Atribuudi süntaks |
Eesmärk |
|
COORDS= nimekirja |
Komadega eraldatud aktiivse tsooni koordinaatide loend (olenevalt antud tsooni kuju tüübist) |
|
HREF = url |
|
|
KUJU = vormi |
Määrab südamiku kuju. Selle atribuudi võimalikud väärtused: ring(ring – määratud keskpunkti ja raadiuse koordinaatidega pikslites); rekt(ristkülik - määratud ülemise vasaku ja alumise parema nurga koordinaatidega); polü(hulknurk - määratud selle tippude koordinaatidega) Kõikidel juhtudel mõõdetakse koordinaate pildi vasakust ülanurgast pikslites, X-telg on suunatud paremale ja Y-telg alla. |
|
NOREF |
mõnikord on vaja näidata, et antud tsoon (määratud atribuudi SHAPE ja COORDS koordinaatidega) ei ole aktiivne, hiireklõpsule ei reageerita |
HTML-dokumentide tabeleid ei kasutata mitte niivõrd andmete paigutamiseks raamitud lahtritesse, vaid teksti ja piltide üksteise suhtes järjestamiseks.
HTML-i tabelid koostatakse ridade kaupa. Kõik tabeliandmed on ümbritsetud siltidega
; iga lahtrirea (ridade) kirjeldus sisaldub siltides ...; iga lahtri sisu sisaldub siltides ... (tavalised lahtrid) või ... H> (päised).
Seega, et kirjeldada näiteks kahe rea tabelit, millest igaüks sisaldab kahte lahtrit, peate looma järgmise konstruktsiooni:
Tabelilahtrid võivad sisaldada teksti, pilte, pesastatud tabeleid jne. Ärge jätke tabeli lahtreid tühjaks; kui mõni lahter peaks tühjaks jääma, asetage sellesse tühik.
Tabeli lahtritesse paigutatud teksti paigutab brauser vaikimisi automaatselt; tekst kuvatakse sõna-sõnalt; Lahtri parempoolse piirini jõudmisel nihutatakse järgmine sõna uuele reale.
Tabeli lahtrid võivad hõlmata mitut rida või veergu; selliste lahtrite kirjeldamisel kasutatakse atribuute ROWSPAN (lahter, mille silt sisaldab seda atribuuti, on "venitatud" määratud arvu ridade võrra) ja COLSPAN (lahter on "venitatud" mitme veeru võrra) kasutatud. Siin on näide ühendatud lahtritega tabeli korraldamisest:
< TR >
< TD ROWSPAN=2>1-1 TD >
Tabeleid kirjeldavatel siltidel on mitmeid valikulisi atribuute.
Sildi atribuudid määravad tabeli kui terviku parameetrid:
|
Atribuudi süntaks |
Eesmärk |
|||
|
JOONDA = väärtus |
Joondus tekstivoo suhtes; võimalikud väärtused on vasakul, paremal ja keskel |
|||
|
TAUST = url |
Taustapilt kogu tabeli jaoks |
|||
|
BGCOLOR= värvi |
Taustavärv |
|||
|
BORDERVÄRV = värvi |
Ääriste värv |
|||
|
BORDERCOLORDARK = värvi |
Värvib põhiraami parema ja alumise serva ning iga lahtri vasaku ja ülemise serva määratud värviga |
|||
|
ÄÄRIVALGUS = värvi |
Värvib põhiraami vasaku ja ülemise serva ning vastavalt iga lahtri parema ja alumise serva määratud värviga |
|||
|
CELLPADDING = väärtus |
Kaugus lahtri piiridest selle sisuni pikslites |
|||
|
CELLSPACING = väärtus |
Lahtrite vaheline kaugus pikslites |
|||
|
HSPACE = tähenduses |
Vaba ruum tabelist vasakul ja paremal pikslites |
|||
|
VSPACE = tähenduses |
Vaba ruum tabeli kohal ja all pikslites |
|||
|
LAIUS = tähenduses |
Tabeli laius (määratud pikslites või protsendina praeguse brauseriakna laiusest) |
|||
Sildi atribuudid täpsustavad antud seeria parameetreid (vastuolude ilmnemisel tühistatakse sildis määratud atribuudid). Lahtri sisu joondamine; võimalikud väärtused on vasakul, paremal ja keskel
TAUST = url
Antud tabelirea lahtrite taustapilt
BGCOLOR= värvi
Selle rea lahtrite taustavärv
PIIR = tähenduses
Selle rea lahtreid ümbritseva äärise paksus; BORDER=0 tähistab nähtamatut äärist
VALIGN = tähenduses
Lahtri sisu vertikaalne joondamine; võimalikud väärtused on ülemine, keskmine ja alumine
Sildi atribuudid määravad antud lahtri parameetrid (vastuolude ilmnemisel tühistatakse ja siltides määratud atribuudid).
|
Atribuudi süntaks |
Eesmärk |
|
JOONDA = tähenduses |
Joonda lahtri sisu; võimalikud väärtused on vasakul, paremal ja keskel |
|
TAUST = ur l |
Taustapilt tabeli lahtri jaoks |
|
BGCOLOR= värvi |
Lahtri taustavärv |
|
PIIR = tähenduses |
Lahtrit ümbritseva raami paksus |
|
VALIGN = tähenduses |
Lahtri sisu vertikaalne joondamine; võimalikud väärtused on ülemine, keskmine ja alumine |
|
LAIUS = tähenduses |
Lahtri laius pikslites või protsent tabeli laiusest |
|
ROWSPAN= tähenduses |
Näitab lahtriga kaetud ridade arvu |
|
COLSPAN = tähenduses |
Määrab lahtriga kaetud veergude arvu |
Tabelitega töötades pidage meeles, et atribuudi WIDTH määratud väärtus märgib paljudel juhtudel ainult brauser ära. Etteantud proportsioone hoitakse harva täpselt, brauser püüab tabelit võimalikult hästi (oma arusaamise järgi) kuvada.
TikerTikeri kasutamine veebilehel muudab selle dünaamilisemaks ja võimaldab luua objekti liikumise efekti. Tikeri loomine sildi abil< MARQUEE >... MARQUEE >.
vahel< MARQUEE >ja MARQUEE > tekstifragmente ja pilte saab leida. Teksti saab vormindada sobivate siltide abil ja graafika sisestamiseks kasutades .
|
Atribuudi süntaks |
Eesmärk |
|
BGCOLOR= värvi |
Taustavärv. Kui taust on määratud, tõmbab brauser ekraanile värvilise triibu, mida mööda tekst või pilt liigub. |
|
KÕRGUS = tähenduses |
Taustariba kõrgus. Väärtus määratakse pikslites või protsendina brauseriakna kõrgusest. Näiteks kui määrate atribuudi HEIGHT=25%, hõivab tickeri riba veerandi akna kõrgusest |
|
LAIUS = tähenduses |
Tickeri riba laius, mis on näidatud pikslites või protsendina brauseriakna laiusest |
|
DIRECTION= tähenduses |
Joone liikumise suund: vasak - vasak (vaikimisi), parem - parem, üles - üles, alla - alla |
|
KÄITUMINE = tähenduses |
Atribuut juhib tickeri käitumist: kerimine (vaikimisi) – akna servani jõudes läheb joon vaateväljast välja ja ilmub seejärel vastasküljele; liug - akna servast ilmub joon, jõuab vastassuunas ja peatub; alternatiivne - joon liigub paremale või vasakule, "peegeldudes" akna servadest ja muutes liikumissuunda |
|
HSPACE = piksli nihe |
Nihutage tickeri riba horisontaalselt paremale |
|
VSPACE = Sina co ta pikslites |
Tühja ruumi loomine riba kohale ja alla |
|
LOOP = tähenduses |
Ridade üleminekute arv üle ekraani |
|
SCROOLAMOUNT = tähenduses |
Pikslite arv, mida joon igal sammul läbib. Vaikerežiim on umbes 10 pikslit sammu kohta. See atribuut võimaldab teil reguleerida joone liikumise kiirust |
|
KERIMISE VIIVITUS = tähenduses |
Määrab sammudevahelise ajaintervalli (millisekundites), seda atribuuti kasutades saab panna joone tõmblema |
|
TRUESPED |
Kui see lipp (ilma väärtuseta atribuut) on määratud, kasutatakse määratud SCROLLDELAY väärtust. Kui lippu pole seatud, on väärtuseks SCROLLDELAY |