Primer strani HTML in osnove ustvarjanja

Izumili so številni jeziki, jezik HTML pa je eden izmed najbolj posebnih in najbolj zahtevnih. Z njim so povezane številne druge ključne pobude pri načrtovanju. Veliko postane na voljo, če je znanje jezika označevanja prisotno v mislih razvijalca - HyperText Markup Language (HTML).

V bistvu v HTML ni nič zapletenega in v nekaj minutah bo katerikoli od najbolj oddaljenih programov in internetne osebe ustvaril HTML stran v prenosnem računalniku. Primer, ki si zasluži pozornost, je preprostost, ki je resnično dostopna vsem.

Splošni opis

Datoteka HTML je ena stran spletnega mesta, čeprav se to lahko argumentira, vendar je dejstvo, da je ena datoteka ena stran, razumljiva za začetek.

Datoteka HTML se začne z glavo DOCTYPE, ki označuje, da je vrsta te datoteke HTML. Vsi elementi strani (oznake) so označeni v kotnih oklepajih. Vsak par ("<"In"> ") vključuje eno HTML oznako. Običajno so oznake HTML seznanjene, to pomeni, da obstaja "/ tag" za vsako "oznako". Obe sta obrnjeni v kotnih oklepajih. Obstajajo posamezne oznake, od katerih je najbolj priljubljen "br /" prehod na naslednjo vrstico.

Največja oznaka v datoteki je HTML sam, ki vključuje le dve oznaki: HEAD in BODY. V prvem delu so narejeni različni opisi, določene so povezave do drugih strani, PHP in jаvascript skripti so lahko prisotni. V drugem delu se zabeleži vsebina strani. Tudi v obliki oznak in skript.

Enostavna HTML-stran

Primer izdelave takšne strani je naveden v nadaljevanju v članku. Razmislite previdno.

Sekcija HEAD

Glavni namen oznake HEAD je splošni opis strani in navadnih skriptov, čeprav je ta relativno relativni koncept. Ponavadi so pomembne le dve stvari:

• ključne besede in opis strani;
• povezave do drugih datotek (* .css in * .js).

Za prikaz vsebine strani vsebuje vsebina tega razdelka le posredni pomen, ker kaže: nekje v drugih datotekah so pravila CSS za oznake in skripte drugih jezikov.

Stran HTML ima naslov (TITLE), ki se prikaže, ko obiskovalec prinese miško na zavihku, kjer je stran odprta. To je pomembna točka, saj naredi stran veliko bolj predstavljivo, lažje reči, podpisana z berljivim besedilom.

META oznake so pomembne pri programiranju interneta na splošno, toda kadar želite ustvariti HTML-stran v prenosnem računalniku, je primer nezaželen za nered s presežnimi konstrukti.

Posebno pozornost je treba nameniti povezavam LINK in SCRIPT. Prvi kaže na mesto, kjer se nahaja slogovna tabela CSS, druga pa na lokacijo datoteke kode jаvascript. Veliko teh referenc je lahko.

Če je treba skripte približati, ko je znanje o HTML okrepljeno, je treba kaskadne slogovne liste takoj posvetiti pozornost. V datotekah CSS so še posebej pravila za oblikovanje oznak HTML.

Oddelek TELO

Pravzaprav primer strani HTML je razdelek BODY. To je tukaj, ki vsebuje vse informacije, celotno vsebino spletne strani. Vse informacije so predstavljene v obliki oznak in skript, na primer vstavljanje kode jаvascript ali kosov PHP-programov.

Pomembno je razumeti, da je primer spletne strani HTML v brskalniku in istem primeru v urejevalniku besedil, še posebej notepad, daleč od istega. V prvem primeru imamo končano HTML-besedilo, v katerem se izvajajo vsi skripti. Na primer, PHP je delal svoj del in je ustvaril potrebne oznake namesto svoje kode na pravih mestih. jаvascript je tudi izpolnil svoje poslanstvo, čeprav še vedno obstaja ločen pogovor o tem.

HTML je oznaka, ne pa skripta. V končni fazi brskalnik prikaže samo vsebino strani, samo njegove oznake. Tam ni PHP kode.

jаvascript je v posebnem položaju, njegovi oskrbi - služiti strani, ne le ob zagonu (preobremenitve), ampak v trenutkih, ko je stran v brskalniku obiskovalca in študij, ki jih.

Preprost primer HTML koda (samo oddelek BODY) je naveden spodaj.

In v brskalniku obiskovalca, izgleda kot spodaj.

Koda ni določala, kako naj gledajo elementi, ki jih prikaže brskalnik. Vsi vidni modeli so v pravilih CSS. V tem primeru je bil v datoteki Mcss / scPhpWordRW.css, na katerega se je skliceval (glej prvi primer strani HTML).

Za razliko od HTML je tema CSS preprostejša, obstajajo zelo dostopna pravila in njihova številka je majhna, če primer ustvarjanja strani HTML ne zahteva nič drugega kot notepad. Vse je zelo dostopno za takojšnje obvladovanje:

To kaže, kako enostavno je opisano oznako scLogo_vDoc, in ta opis je, da je v normalnem stanju oznako prikaže sliko vDoc-logo.jpg, in ko je miška nad njim - prikaže vDoc-logo-h.jpg.

Struktura opisa HTML

Jezik ne pomeni nobene strukture in koncept sintakse tukaj je zelo relativen. Ni spremenljivk, vendar obstaja veliko možnosti. Osnovna osnova hiperteksta je, da obstaja element (oznaka), ki ima nujno ime.

Ime je v primeru oznake para sestavljeno iz ustreznega imena (tagName) in kotnih oklepajev ("<"+ TagName +"> "), če je začetek oznake in» «, če je njegov konec napisan.

Primer HTML strani, ki opisuje atribute, je v besedilu spodaj.

Oznaka ima lahko atribute, nato pa se dajo po presledkih po imenu za oznako pred kotom za zaključni kot ">". Atributi, če imajo oznako, so napisani samo na začetku oznake. Vsebina oznake je tisto, kar je med začetkom oznake in njegovim koncem.

Splošna vsebina opisov HTML

HTML vam omogoča opisovanje elementov bloka in nizov. Prvi zasedajo določeno območje v oknu brskalnika, se lahko popolnoma pozicionira, to je na pravem mestu v prikaznem območju strani HTML in ima določeno velikost.

Nizni elementi so običajno prikazani v eni niti, to je, kot je navedeno v datoteki strani, in so prikazane. Na strani prikaza celotnega pretoka lahko vpliva, če se stran naloži. Umestitev, vidljivost in druge lastnosti blokovnih elementov lahko kadar koli vplivajo na kodo jаvascript.

Poleg preprostih elementov HTML ponuja tudi opis tabel in obrazcev. Ti elementi so zelo zahtevni pri "vsakodnevni gradnji mest".

Opis tabele: oznake TABLE, TR, TD

Ko se TABLE tag lahko uporablja za ustvarjanje tabele, določi število vrstic in TR v vrsti za številne TD celic. V nasprotju z običajnimi mizo organizacije, zaradi narave HTML-označevalni tabele organizacije omejen na te izjave, ker če želi razvijalec imeti pravokotno mizo, v katerem se je število stolpcev v vseh vrstah enak, potem mora slediti, da za sebe.

Osnovni položaj HTML: narediti vse, kar je označeno, vendar nič, kar ni razumljeno. V nekaterih primerih število stolpcev v vsaki vrstici tabele ni tako pomembno, če pa morate združiti celice navpično ali vodoravno, boste morali vse previdno šteti.

Primer članka HTML, ki opisuje preprosto tabelo, je v članku jasno prikazan.

Tukaj je tabela, ki prikazuje velikost treh vrstic s tremi stebri, s prvo vrstico oznako TH je bil uporabljen namesto TD tag - glavo stolpca. Še posebej razlikovati ti dve oznake nimajo, vendar je mogoče uporabiti najprej razlikovati med prvo vrstico tabele in CSS na TH, lahko priložite svoj slog, ki se razlikuje od drugih TD.

Opis obrazca: oznake FORM, INPUT

Obrazci so najbolj zahtevani del HTML oznak. Z uporabo obrazcev lahko prenesete podatke. Pravzaprav je samo informacija izhod informacij, vendar je oblika njen vnos.

Primer strani HTML s preprostim opisom obrazca:

Različice uporabe obrazcev so veliko večje, vendar so glavne možnosti naslednje. Določite polja vnosa, jim dodelite načrt in obdelovalce za analizo uporabniškega vhoda. Podate lahko skrita polja in pošiljajte informacije o ozadju s strani. Gumbi za prenos informacij lahko označite s klikom, na katerih se začne prenos podatkov.

Uporaba HTML

Če želite vedeti, hipertekst jezik - nujen pogoj za kakršno koli delovno specializacijo na področju interneta programiranja, ampak če hočeš napisati program v PHP ali jаvascript, potem veste, HTML + CSS potrebujejo odlično.

Jezik PHP je bil označen v prejšnjem primeru. PHP teče na strežniku, ker je stran s tem obrazcem iz polnega strežnika preusmerila v brskalnik. Zlasti funkcija Testonblur, omenjena v oznaki INPUT (onblur event handler), je prejela vse parametre v obliki besedilnih polj.

Brskalnik teče jаvascript in pravilno delali podatki pošljite gumb nazaj na strežnik, da je oblikovanje :. onclick = jQuery ( "# k) val (" košarica "), je treba vedeti, ne samo o tem, kaj jQuery, ampak tudi tisto, kar je #to, val, cart. Natančneje, morate poznati glavne HTML oznake in splošna pravila za uporabo slogov CSS.

To je dovolj, da hitro poveča svoje kvalifikacije za katero koli specializacijo na področju programiranja interneta.