Ako príklad HTML stránky a základné princípy

Vynašiel mnoho jazykov, ale jazyk HTML je jedným z najviac zvláštne a vosstrebovan. Vzhľadom k tomu, že zahŕňa mnoho ďalších kľúčových iniciatív v oblasti programovania. Veľa je k dispozícii, ak v mysliach vývojárske súčasných znalostí značkovací jazyk - HyperText Markup Language (HTML).

V skutočnosti, v HTML, nie je nič zložité, a za pár minút všetko najviac vzdialených od programovania a internetu ľuďom splní vytvorenie HTML stránok v notebooku. Za zmienku stojí, jednoduchosť skutočne prístupné pre každého.

všeobecný popis

HTML súbor - jednostranový web, aj keď je to diskutabilné, ale to, čo je jeden súbor na stránku, pre začiatok je to jasné.

HTML súbor začína hlavičkou DOCTYPE, ktorá určuje, že typ súboru - HTML. Všetky prvky strana (značky) sú uvedené v hranatých zátvorkách. Každá dvojica ( "<" a ">") obsahuje jednu značku HTML. Obvykle HTML tagy sú spárované, to znamená, že pre každú značku «» mať «/ deň». Obaja sú uzavreté v hranatých zátvorkách. K dispozícii je jeden tag, z ktorých najpopulárnejšia «br /» - prechod na ďalší riadok.

Najväčší tag v súbore - to sám HTML, ktorá obsahuje iba dve značky: hlavy a tela. V prvom prípade, odlišné špecifikácie svedčí o odkazy na ďalšie súvisiace súbory stránok môžu byť prítomné PHP a skripty JavaScript. Na druhú stranu písomného obsah. Aj vo forme značiek a skriptov.

Jednoduché HTML stránok

Príklad vytvorenie takej stránky je uvedené v nižšie uvedenom článku. Zoberme si to starostlivo.

sekcia HEAD

Hlavným zmyslom HEAD tag - všeobecný popis stránky a všeobecné skripty, aj keď druhý - len relatívny pojem. Obvykle prikladá značný význam len dve veci:

• kľúčové slová a popis stránky;
• odkazy na iné súbory (* CSS a JS *).

Ak chcete zobraziť obsah stránok obsahu tejto časti má iba nepriamy význam, pretože to ukazuje, kde niektoré ďalšie súbory majú CSS pravidlá pre značky a ostatné skripty jazykov.

HTML stránok má názov (titul), ktorý sa zobrazí, keď návštevník prináša myši na záložku, kde je stránka otvorený. To je dôležité, pretože to robí stránky oveľa reprezentatívnejšia, ľahšie povedať, podpísal čitateľný text.

Meta-tagy sú dôležité pre webové programovanie všeobecne, ale ak je to požadované vytvorenie HTML stránok v notebooku, príklad nežiaduce spleti redundantných štruktúr.

Na odkaz a Script odkazy by mali venovať osobitnú pozornosť. Prvá sa vzťahuje k miestu, kde je CSS štýlov súboru, druhý - umiestnenie súboru JavaScript kódu. Tieto odkazy možno nastaviť.

Ak používate skripty by sa mali považovať za znalosti HTML stane silnejší, mali by ste okamžite dávať pozor na kaskádových štýlov. Súbory CSS sú najmä pravidlá registrácie HTML tagy.

sekcie BODY

V skutočnosti vzorka stránky HTML - to je časť tela. Je tu, ktorá obsahuje všetky informácie, všetok obsah stránky. Všetky informácie sú uvedené vo forme značiek a skripty, ako je napríklad vloženie JavaScriptu kód alebo kúsky PHP-programu.

Je dôležité si uvedomiť, že príklad HTML stránky v prehliadači a v rovnakom napríklad v textovom editore, ako je napríklad Poznámkový blok, to nie je to isté. V prvom prípade sme pripravení HTML textu, v ktorej všetky skripty vykonané. Napríklad PHP splnila svoju úlohu a vytvoril miesto kódu na správnych miestach tagy. JavaScript tiež splnila svoje poslanie, aj keď o tom ešte rokovať o samostatný rozhovor.

HTML - to označí miesto skriptov. Nakoniec, len obsah stránky zobrazenej v prehliadači, ale jeho značka. No PHP kód tam nie je.

JavaScript je v osobitnej situácii, jeho starostlivosti - slúžiť stránku, a to nielen v čase spustenia (preťaženie), ale vo chvíľach, keď je stránka v prehliadača návštevníka, a študuje.

Jednoduchý príklad z kódu HTML stránky (iba sekcia BODY) je uvedený nižšie.

Návštevníka prehliadač vyzerá to, ako je uvedené nižšie.

nebol zadaný v kóde by mal vyzerať prvkov, ktoré priniesli prehliadač. All dizajn je viditeľný na pravidlá CSS. V tomto prípade, MCSS / súbor scPhpWordRW.css, ktorý bol odvolával sa na (viď. Úplne prvý príklad kódu HTML stránky).

Na rozdiel od HTML, CSS téma je jednoduchšie, tam je veľmi dobre prístupný pravidlá a ich počet je malý, keď je príkladom tvorby HTML stránok nie je nič iné, než požadovať poznámok. Všetko je veľmi dobre prístupný k okamžitému vývoju:

To ukazuje, aké ľahké je popísané tag scLogo_vDoc, a tento opis je, že v normálnom stave tag zobrazí obrázok vDoc-logo.png, aj keď myš je nad ním - zobrazí vDoc-logo-h.png.

Štruktúra popisov HTML

Jazyk nezahŕňa vykonávať akúkoľvek štruktúru a syntax konceptu je tu veľmi relatívna. Nie sú žiadne premenné, ale existuje veľa príležitostí. Základným podkladom hypertextu je, že je prvok (tag), ktorá je určite mať názov.

Meno prípade dvojice tag, ktorý sa skladá z vlastných mien (tagname) a lomených zátvoriek ( «<» + tagname + «>»), ak sa bavíme o začiatku tag, a «», ak je nahraná jej koniec.

Príkladom HTML stránok popisujúcich atribúty nachádzajú v nižšie uvedenom texte.

Značka môže mať atribúty, potom sú presadiť miesta, po názvu značky pred záverečnou uholníkom ">". Atribúty, ak majú značka je zaznamenaná len na začiatku. Obsah tagu je tá, ktorá leží medzi počiatočnou značkou a jej konci.

Celkový opis obsahu HTML

HTML umožňuje popísať blokové a inline elementy. Prvý zaberajú určitý priestor v okne prehliadača môže byť umiestnené absolútne, že je na správnom mieste v oblasti zobrazenia HTML stránok, a majú určitú veľkosť.

Inline elementy zvyčajne objaví jedno vlákno, ktoré je, ako bolo uvedené v stránkovacieho súboru, a zobrazí na obrazovke. Zobrazenie celkového toku môže byť ovplyvnený, ak dôjde k načítanie stránky. Pokiaľ ide o umiestnenie, viditeľnosť a iné vlastnosti blokových elementov môže byť ovplyvnený kedykoľvek pomocou JavaScriptu kódu.

Okrem jednoduchých prvkov HTML ponúka popísať tabuľky a formuláre. Tieto prvky sú veľmi veľa v dopyte v "bežnom stavenisku."

Popis tabuľky: tagy TABLE, TR, TD

Kedy možno TABLE tag slúži na vytvorenie tabuľky, zadať počet riadkov a TR v rade pre rad TD buniek. Na rozdiel od obvyklej tabuľky organizácie, vzhľadom na povahu HTML značkovacieho tabuľkové organizácie obmedzený na toto vyhlásenie, pretože v prípade, že developer chce mať obdĺžnikový stôl, v ktorom je počet stĺpcov vo všetkých radoch rovnaké, potom musí nasledovať, že pre seba.

Principiálny pozície HTML: robiť to, čo je, ale nič, čo nie je známy. V niektorých prípadoch nie je počet stĺpcov v každom riadku tabuľky tak dôležitá, ale ak chcete vykonať zlúčenie buniek vodorovne alebo zvisle, je nutné počítať všetko veľmi starostlivo.

Príklad HTML stránky s popisom jednoduché tabuľky graficky znázornené v tomto článku.

Tu je tabuľka ukazujúca veľkosť troch radoch tri stĺpce, prvom rade tagu TH bol použitý namiesto TD tagu - záhlavie stĺpca. Najmä rozlíšiť tieto dve značky nemajú, ale je možné použiť ako prvý rozlišovať medzi prvým riadku tabuľky a CSS k TH môžete pripojiť svoj vlastný štýl, ktorý ju odlišuje od ostatných TD.

Popis forma: FORM tag, INPUT

Formulár - to je najžiadanejší časť HTML tagy. Používanie formy môžu odovzdávať informácie. V skutočnosti je strana - táto informačný displej, ale forma - vstup.

Príklad stránky HTML s popisom jednoduchého formulára:

Použitie foriem oveľa viac, ale hlavné rysy sú nasledovné. Môžete zadať vstupné pole, je potrebné priradiť im navrhnúť a spracovanie udalostí pre analýzu vstupu používateľa. Môžete určiť skryté polia a odovzdávať informácie z pozadia stránky. Môžete určiť tlačidlo prenos informácií, lisovanie, že začne proces prenosu dát.

pomocou HTML

Ak chcete vedieť hypertext jazyk - základnou podmienkou pre akúkoľvek pracovnú špecializáciu v oblasti internetového programovania, ale ak chcete napísať program v PHP alebo JavaScripte, potom vedzte, HTML + CSS potrebujú dokonale.

PHP jazyk bola identifikovaná v predchádzajúcom príklade. PHP beží na serveri, pretože stránky s touto formou letel zo servera do prehliadača s polí obsadených. Najmä TestOnBlur funkcie uvedené v tagu INPUT (onBlur obsluhy udalostí), obdržal všetky parametre v podobe textových polí.

Prehliadač beží JavaScript, a aby pracoval správne údaje tlačidlo odoslať späť na server, to znamená, že konštrukcia:. Onclick = jQuery (, # k ') val (, vozík'), je nutné poznať nielen o tom, čo jQuery, ale čo #to, val, vozík. Presnejšie povedané, je nutné poznať základné HTML tagy a všeobecné pravidlá vzťahujúce sa na ne štýly CSS.

To je dosť rýchlo zvýšiť kvalifikáciu akékoľvek špecializáciu v oblasti internetového programovania.