Vytvorenie html stránky v poznámkovom bloku: vysvetlenie pre figuríny. Zarovnať hlavičku na stred

Úloha 1: Vytvorenie základných HTML súborov

Ak chcete vytvoriť súbor HTML, postupujte takto:

    Vytvorte priečinok HTML, do ktorého si uložíme vytvorené Web stránky.

    Spustite štandardný program Poznámkový blok.

    Zadajte do okna editora najjednoduchší text súboru HTML:

Tréningový súbor HTML

Utorkový rozvrh hodín

    Uložte súbor ako RASP.HTM.

    Ak chcete zobraziť vytvorenú webovú stránku, stiahnite si prehliadač Microsoft Internet Explorer.

    Otvoriť v ponuke prehliadača Súbor(Súbor), Otvorené(otvorené), Vyhliadka(Prehľad- Prehľadávať) a nájdite súbor RASP.HTM v priečinku KURS a nahrajte ho. Uistite sa, že názov webovej stránky (HTML Tutorial) je zobrazený v hornom stavovom riadku prehliadača.

Úloha 2.Ovládanie rozloženia textu na obrazovke

Informácie.

Pri zobrazovaní dokumentov HTML prehliadače automaticky rozložia text na obrazovku, bez brania vziať do úvahy zlomy riadkov a po sebe idúce medzery, ktoré sa vyskytujú v súbore.

    V prípade potreby postupujte podľa p.p. 5-6 úloh 1.

    Otvorte pôvodný zdroj webovej stránky - v ponuke prehliadača vyhliadka(Vyhliadka), Zdroj (akoHTML) otvorí sa okno so štandardným programom Poznámkový blok, v ktorom je vaša webová stránka prezentovaná pomocou príkazov HTML.

    Upravte text v súbore HTML umiestnením slov „Rozvrh“, „triedy“, „Utorok“ do rôznych riadkov:

Tréningový súbor HTML

Rozvrh

triedy

v utorok

    Uložte zmeny do súboru RASP.HTM pomocou príkazov Súbor(Súbor), Uložiť(Uložiť). Zatvorte program Poznámkový blok.

    Použite Microsoft Internet Explorer na zobrazenie novo získanej webovej stránky pomocou klávesu F5 alebo pomocou príkazov vyhliadka(Vyhliadka), Obnoviť (Obnoviť). Zmenil sa obraz textu na obrazovke?

Poznámka

V budúcnosti, po vykonaní zmien na webovej stránke, vždy postupujte podľa krokov 4-5.

Úloha 3. Značky zalomenia riadkov a odsekov

Informácie.

Existujú špeciálne príkazy, ktoré vykonávajú zalomenie riadku a nastavujú začiatok nového odseku. Okrem toho existuje príkaz, ktorý zabraňuje programu prehliadača akýmkoľvek spôsobom meniť formátovanie textu a umožňuje presne reprodukovať zadaný fragment textového súboru na obrazovke.

Značka posuvu riadkov
oddeľuje riadok od nasledujúceho textu alebo grafiky. značka odseku

Tiež oddeľuje riadok, ale aj pridáva prázdny riadok, ktorý vizuálne zvýrazní odsek. Obe značky sú jednodielne.

    Vykonajte zmeny v texte súboru HTML:

Tréningový súbor HTML

Rozvrh

triedy

v utorok

    4. Uložte zmeny do súboru RASP.HTM.

    Na zobrazenie novo prijatej webovej stránky použite Microsoft Internet Explorer Ako sa zmenil text na obrazovke?

Úloha 4. Výber fragmentov textu

Informácie.

Tagy výberu textu umožňujú ovládať zobrazenie jednotlivých znakov a slov. Existujú tri značky na výber textu:

… zvýrazniť tučný,

… zvýrazniť kurzívou

… zvýrazniť podčiarknutie.

Tréningový súbor HTML

Rozvrh triedy v utorok

2. Pozrite si novo prijatú webovú stránku.

Je možné použiť kombinované písma:

Rozvrh triedy v utorok

Zároveň si však musíte pamätať na nasledujúce pravidlo pre písanie kombinovaných značiek:

<Тэг-1> <Тэг-2> … Značka-2>

chybné zadanie

Úloha 5: Používanie štýlov nadpisov

Informácie.

Existujú dva spôsoby, ako ovládať veľkosť textu zobrazovaného prehliadačom:

    používanie štýlov nadpisov,

    nastavenie veľkosti hlavného dokumentu alebo veľkosti aktuálneho písma.

Existuje šesť značiek nadpisov (H1 až H6). Každá značka má špecifický štýl špecifikovaný v nastaveniach prehliadača. Štýl H1 je najväčší.

    Vykonajte zmeny v súbore RASP.HTM:

Tréningový súbor HTML

Rozvrh

triedy v utorok

    Pozrite si novo prijatú webovú stránku.

Úloha 5. Nastavenie veľkosti aktuálneho písma.

Informácie.

značka písma umožňuje nastaviť veľkosť aktuálneho písma na jednotlivých miestach textu. Aktuálny rozsah nastavenia písma je od 1 do 7.

    Vykonajte zmeny v súbore RASP.HTM:

Tréningový súbor HTML

Rozvrh

triedy na utorok

    Zmeňte veľkosť písma pre text "trieda v utorok" sami pomocou značky .

    Upravte text dokumentu HTML pomocou značiek na výber textu a značiek zalomenia riadkov a odsekov.

Úloha 6. Typ písma a farba písma

Informácie.

Tag Poskytuje kontrolu nad veľkosťou, štýlom a farbou textu. Zmena typu písma sa vykonáva jednoduchým pridaním k štítku Atribút FACE. Napríklad, ak chcete zobraziť text písmom Arial, musíte písať .

Ak chcete zmeniť farbu písma značky možno použiť atribút COLOR="X".

Namiesto X musíte nahradiť názov farby (v úvodzovkách) alebo jej hexadecimálnu hodnotu. Pri zadávaní farby pomocou hexadecimálneho čísla môžete túto farbu reprezentovať rozloženú na tri zložky:

červená (R), zelená (G), modrá (B), z ktorých každá má hodnotu od 0 do FF.

Príklady farebného záznamu vo formáte RGB sú uvedené v tabuľke:

stôl 1

Farba

Farba

Fialová

Hnedá

Oranžová

tyrkysová

    Vykonajte zmeny v súbore RASP.HTM:

Tréningový súbor HTML

Rozvrh >

triedy na utorok

    Zmeňte veľkosť, farbu, typ písma, štýl textu dokumentu sami.

Úloha 7. Vodorovné zarovnanie textu

Informácie.

HTML tagy riadia horizontálne zarovnanie textu. Ak nešpecifikujete metódu zarovnania, všetky prvky v dokumente budú zarovnané doľava a budú mať zubatý pravý okraj (pozri obrázok 2).

Moderné prehliadače používajú atribút zarovnania textu ZAROVNAŤ=, ktorý je vložený do značiek odsekov alebo nadpisov.

    Vykonajte zmeny v súbore RASP.HTM:

Tréningový súbor HTML

Rozvrh>

triedy na utorok

Úloha 8. Nastavenie farieb pozadia a textu

Informácie.

Pri zobrazovaní pozadia, textu používajú prehliadače predvolene nastavené farby – sú dané nastavením prehliadača. Tieto farby sú nastavené na začiatku súboru HTML v značke . Zadanie farby je podobné farbe písma (pozri tabuľku 1, odsek 12). Atribút BGCOLOR= nastavuje farbu pozadia stránky, TEXT= definuje farbu textu pre celú stránku, LINK= a VLINK= definujú farby nenavštívených a navštívených odkazov (posledné dva parametre si rozoberieme neskôr).

    Vykonajte zmeny v súbore RASP.HTM:

Tréningový súbor HTML

BGCOLOR="#FFFFCC" TEXT="#330066">

Rozvrh>

triedy na utorok

Úloha 9.

    Experimentujte s vytvoreným dokumentom. Pri zmene veľkosti okna uvidíte, ako prehliadač vykresľuje text s vynútenými zalomeniami riadkov. Čo sa stane, keď sa okno zmenší natoľko, že sa doň nezmestí ani jediné slovo?

    Vytvorte si svoj vlastný HTML dokument sami. Nech je to krátky príbeh o vás a vašich záľubách.

Dobrý deň, milí čitatelia blogu! Pokračujeme v sekcii „Vytvorenie stránky od začiatku“ a najmä v téme značiek ... A dnes zvážime značky, ktoré sa nachádzajú na akejkoľvek webovej stránke - , A . Je tu ešte jeden tag, ktorý by mal byť v každom HTML dokumente a o ktorom som už písal v jednom z predchádzajúcich článkov – takže sa ho nebudeme dotýkať.

V predchádzajúcich článkoch stĺpca som písal o vytvorení prázdneho súboru vo formáte html. V skutočnosti to bolo použité v profesionálnom článku (tam boli použité značky názvu). Teraz priamo upravíme tento súbor s úplnými popismi.

A začnime článok úpravou vytvoreného súboru. Osobne som to pomenoval index.html, ale názov môže byť akýkoľvek. Otvorte ho pomocou ľubovoľného textového editora (je lepšie použiť Notepad++, pretože má zvýraznenie kódu a ďalšie užitočné pomôcky). A hneď k tomu pridajte značky , A presne v poradí, v akom sú napísané. Nezabudnite ich zavrieť, ako je znázornené na snímke obrazovky. Dokument bude vyzerať takto:

Teraz zvážte význam každej značky samostatne. Niet divu, že sú v každom. HTML dokument.

Funkcie značiek

Takže značka je kontajner(). Vnútri je všetok viditeľný a neviditeľný obsah webovej stránky (vrátane značiek A ). Otváracia značka prichádza bezprostredne po deklarácii Doctype a po uzávierke je na konci dokumentu. Prehliadaču teda dáva jasne najavo, kde začať so spracovaním dokumentu a kde ho ukončiť.

Teoreticky môže sám pochopiť, čo a ako. Po všetkom ? Toto je prekladač jazyka HTML a je nepravdepodobné, že začne spracovávať od polovice dokumentu a dokončí ho skôr, než sa dostane na koniec. Otázka je, samozrejme, diskutabilná, ale vždy som si myslel (a teraz sa svojho názoru nevzdávam), že napísanie tohto tagu je povinné.

Aj vzhľadom na to, že funkcia tohto tagu je len in ohraničujúci obsah, má svoje vlastné atribúty (ktoré sa teraz buď nepoužívajú vôbec, alebo sa používajú veľmi zriedkavo). Rôzne zdroje uvádzajú atribúty, ktoré sa navzájom líšia, takže si netrúfam uviesť správnu verziu.

Jediná vec, ktorú môžem povedať s istotou, je, že väčšina atribútov nie je podporovaná HTML 4.01 alebo sú nežiaduce. Dám vám však jeden príklad. - popis kdekoľvek v dokumente. Napríklad, keď umiestnite kurzor myši na obrázok, môže sa zobraziť kontextový text. Aj v prípade tejto značky:

A toto uvidíte, keď umiestnite kurzor myši na dokument s týmto obsahom:

Je lepšie použiť atribút title, ktorý nie je súčasťou značky , ale v iných špecifických oblastiach stránky. Po prvé, je to pohodlné a po druhé, vyhľadávače sa k vašej stránke budú správať lepšie. Táto značka priamo neovplyvňuje optimalizáciu zdrojov. Ideme ďalej.

Funkcia značky

A ďalší v poradí je tag . Obsahuje všetky technické informácie o stránke, ktoré slúžia na pomoc prehliadaču a vyhľadávačom. Značka je kontajnerová značka a nasleduje bezprostredne po nej , len na rozdiel od poslednej, záverečnej značky nezobrazuje sa na konci dokumentu, ale pred úvodnou značkou .

Aké informácie možno nájsť v ? Ale žiadny. Všetko v tejto značke je dostupné len ľudskému oku zobrazením zdrojového kódu stránky. Všetok obsah v tejto značke je pre vyhľadávače a prehliadače. Jediné, čo ako-tak vidíte, je štítok , ktorý je zodpovedný za nadpis okna webovej stránky. Tu je príklad:</p> <p><img src='https://i1.wp.com/monetavinternete.ru/wp-content/uploads/2013/01/Title-v-tege-head.png' align="center" width="100%" loading=lazy loading=lazy></p> <p>Text za ikonou je obsahom značky <title>. Teraz sa pozrime na obsah. <head>, ktorú nevidíme, no ktorá je veľmi dôležitou súčasťou <b>tvorba a propagácia stránky.</b> V prvom rade je to línia</p><p> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> </p><p>Toto je metaznačka pre <b>typ obsahu stránky</b>(Typ obsahu). V tomto prípade ide o html kód v kódovaní UTF-8 (content="text/html; charset=UTF-8"). Ďalej nasleduje vyššie popísaná značka názvu. Potom prídu riadky začínajúce značkou <link>. Označuje prepojenie na externý dokument. Napríklad linka</p><p> <link href="http://сайт/.../style.css" rel="stylesheet" media="screen" type="text/css" /> </p><p>označuje, že je pripojený súbor (rel="stylesheet") s (type="text/css"), ktorý sa nachádza na tej a takej adrese (pre skrátenie dĺžky riadku som polovicu adresy nahradil bodkami) . Po spracovaní tohto reťazca prehliadačom určí, kam sa má dostať <b>kaskádové štýly</b>.</p> <p>Vo všeobecnosti je v značke hlavy veľa informácií, o ktorých sa dá hovoriť donekonečna. Posledná vec, ktorá stojí za zmienku (konkrétne v prípade ), je prítomnosť popisných značiek, kľúčových slov a kanonických. používam <b>plugin All in One SEO Pack</b>, takže sú prítomné vo vnútri <head>.</p> <p>Ako viete, všetko veľké vždy začína v malom. Ak vás zaujíma odpoveď na otázku, ako vytvoriť webovú stránku cez poznámkový blok, určite ste o tejto možnosti už niekde počuli. To je skutočne možné. Okamžite však stojí za zmienku, že v súčasnosti s najväčšou pravdepodobnosťou nikto nevytvorí modernú dynamickú interaktívnu stránku prostredníctvom poznámkového bloku, pretože na to existujú špeciálne programy, ktoré výrazne urýchľujú a zjednodušujú proces vývoja. Je však celkom možné vytvoriť plnohodnotnú webovú stránku.</p><b>Ako vytvoriť webovú stránku v poznámkovom bloku</b><br>Na začiatok je potrebná malá znalosť teórie a všeobecných pojmov. Prevažná väčšina webových stránok sú bežné textové dokumenty, ktoré sú navrhnuté špeciálnym spôsobom - jazykom hypertextových značiek, skrátene HTML. Niektorí klasifikujú značenie HTML ako programovací jazyk, ale to nie je pravda. <p>HTML je len spôsob štandardizácie označovania dokumentov, ktoré prehliadače jedinečne interpretujú tak, aby sa zobrazovali na obrazovkách počítača v užívateľsky príjemnej forme. Hlavným nástrojom jazyka HTML sú špeciálne štrukturálne prvky, pomocou ktorých sa dokument zostavuje. Nazývajú sa deskriptory alebo značky.</p><p>Vo všeobecnosti je značka konštrukciou formulára <table>Značka teda začína na< после которого следует название тега table и вся конструкция завершается знаком >. Značky prichádzajú v pároch, ako keby bol text tučný <b>A</b> a nespárované ako nový riadok <br>. V prípade použitia párových štítkov je potrebné ho použiť ako otvárací štítok <b>a zatváranie</b>. Záverečná značka je deskriptor s lomkou /.</p><p>Zvážte hlavné typy značiek a ich účel.</p><ul><li><span><i>Prvok <b><!DOCTYPE html> </b>. </i> Nastaví sa na úplný začiatok stránky a informuje prehliadač, ako má tento dokument interpretovať. Je to voliteľné, ale na stránke veľmi žiaduce, aby sa predišlo prípadným problémom s jej zobrazením. <br></span></li><li><span><i>Tag <b><html> </b>. </i> Ide o párovú značku a skladá sa z dvoch častí <html>A</html>. Každá stránka na webe začína touto značkou a končí ňou. <br></span></li><li><span><i>Tag <b><head> </b>. </i> Je to tiež párový štítok a skladá sa z dvoch častí <head>A</head>. Táto značka obsahuje rôzne dôležité informácie o stránke: jej názov, odkazy na použité štýly dizajnu, zahrnuté skripty, špeciálne metadáta. <br></span></li><li><span><i>Tag <b><title> </b>. </i> <title>A a nachádza sa vo vnútri štítku . Táto značka definuje názov stránky, s ktorou bude viditeľná v prehliadači.

  • Tag . Ide o párový štítok, ktorý sa skladá z dvoch častí A a nasleduje značku Na stránke. Je v značke <body>, ktorá obsahuje všetky informácie, ktoré sa zobrazujú na stránke v prehliadači.
  • Tag . Je sám. Používa sa na označenie zalomenia riadku v dokumente.
  • Tag . Odkazuje na párové značky, je napísaný v mierne odlišnej forme ako ostatné značky a používa sa na vytváranie odkazov. Je základným prvkom celej koncepcie jazyka HTML, ako aj internetu ako celku.
  • Tag

    . Vzťahuje sa na párové značky a skladá sa z dvoch častí. S jeho pomocou sa vytvorí textový odsek.

  • značky

    ,

    ,

    ,

    ,
    ,
    . Patria k párovým tagom, keďže sa skladajú napríklad z dvoch tagov

    A

    . Tieto značky slúžia na vytvorenie šiestich úrovní podnadpisov a zároveň ukazujú dôležitosť textu v nich obsiahnutého vo vzťahu k celému dokumentu.

  • Tag . Je to tiež párový štítok, ktorý sa skladá z dvoch častí A a nastaví štýl písma na tučné.
    • Celkovo je to asi sto značiek, ale desať zvažovaných už stačí na navrhnutie najjednoduchšej stránky webu v poznámkovom bloku. Základné štítky dokumentov , , , <body>distribuované v prísnom poradí. Vo vnútri štítku <body>ostatné deskriptory môžu byť v rôznom poradí v rámci štandardov jazyka HTML. Najjednoduchší spôsob, ako to pochopiť, je vytvoriť si jednoduchú webovú stránku. <ol><li><span>Spustite Poznámkový blok a v jeho prvom riadku nastavte prvok<!DOCTYPE html>, ktorý prehliadaču povie, ako má interpretovať váš dokument. <p> <!DOCTYPE html></p></span></li><li><span>Vytvorte nový riadok a pridajte párovú značku <html>. Preložte záverečnú značku</html> o dva riadky nižšie. <p> <!DOCTYPE html><br><html></p></span></li><li><span>Pridajte párovú značku <head>v rade medzi značkami <html>a preložiť uzatváraciu značku</head> o dva riadky nižšie. <p> <!DOCTYPE html><br><html><br><head></p><p></head><br></html></p></span></li><li><span>On-line medzi značkami <head>A</head> napíšte párovú značku <title> v jednom riadku.






  • Medzi značky zadajte názov svojej webovej stránky A. Napríklad takto.




    Moja prvá webová stránka

  • Umiestnite kurzor na riadok za uzatváracou značkou a urobte posun riadkov. Do prázdneho riadku, ktorý sa zobrazí, zadajte párovú značku .




    Moja prvá webová stránka


  • Vykonajte dvojitý preklad medzi vnútornými značkami A. V zobrazenom riadku zadajte párovú značku názvu

    . Napíšte do značky

    titulok stránky.




    Moja prvá webová stránka


    O mne



  • Po záverečnej názve taguurobte zalomenie riadku a nastavte párové značky odseku na nový riadok. Vložte medzi ne text. Napríklad áno.




    Moja prvá webová stránka


    O mne


    Volám sa Ivanov Ivan. Vytváram svoj web.



  • Meno a priezvisko uzavrite do párovej značky aby boli odvážne.




    Moja prvá webová stránka


    O mne


    Moje meno je Ivanov Ivan. Vytváram svoj web.



  • Po zatvorení značky odseku

    vykonajte posun riadku a zadajte značku páru na nový riadok

    . Medzi značky zadajte text.




    Moja prvá webová stránka


    O mne


    Moje meno je Ivanov Ivan. Vytváram svoj web.


    Môj pokrok



  • Po záverečnej značke titulkovznova zalomte riadok, zadajte párovú značku odseku a medzi tieto značky napíšte ľubovoľný text.




    Moja prvá webová stránka


    O mne


    Moje meno je Ivanov Ivan. Vytváram svoj web.


    Môj pokrok




  • Z tagov uvedených v článku zostali neprebádané dva – line feed
    a najdôležitejšia značka na vytváranie odkazov     . Poďme ich aplikovať. Pred posledným uzatváracím tagom zadajte deskriptor
    , a medzi
    A

    typová konštrukcia. Mali by ste dostať nasledovné.




    Moja prvá webová stránka


    O mne


    Moje meno je Ivanov Ivan. Vytváram svoj web.


    Môj pokrok


    Základná syntax HTML bola zvládnutá a bola vytvorená prvá stránka budúceho webu.
    V procese školenia boli použité materiály lokality



  • Medzi úvodzovkami v značke zadajte adresu stránky, na ktorú budete odkazovať. Pred tagom môžete zadať slovo Odkaz a medzi značky A zadajte text, ktorý sa zobrazí na stránke.




    Moja prvá webová stránka


    O mne


    Moje meno je Ivanov Ivan. Vytváram svoj web.


    Môj pokrok


    Základná syntax HTML bola zvládnutá a bola vytvorená prvá stránka budúceho webu.
    V procese školenia boli použité materiály lokality

    odkaz: webové stránky



  • Na tomto je možné dokončiť vytvorenie najjednoduchšej stránky pre web. V zásade by sa to dalo absolvovať aj v bode 9, ale ak to s učením jazyka HTML myslíte vážne, ďalšie precvičovanie nebude zbytočné. Uložte si stránku s príponou *.html a môžete ju otvoriť v ľubovoľnom prehliadači a zobraziť výsledky svojej práce. Ak je všetko vykonané správne, mali by ste vidieť niečo ako nasledovné.
    • Ak po prečítaní tohto článku vaše odhodlanie vytvoriť web nevyschlo, určite sa oboznámte s úplnou syntaxou jazyka HTML a naučte sa používať kaskádové štýly CSS pre návrh stránky.

    Vývoj webových stránok pomocou jazyka HTML Hypertext Markup Language

    8. trieda

    Lekcia 1 Štruktúra webovej stránky.

    Koncept webovej stránky

    Informácie na World Wide Web
    uložené vo forme webových stránok.
    Webová stránka má podobnú štruktúru ako
    časopis na nejakú tému resp
    problém. Ako sa skladá časopis
    tlačené stránky a webová lokalita
    z webových stránok počítača.
    Webové stránky sú prepojené hypertextovými odkazmi.

    Typy webových stránok

    úradník (vláda,
    Duma, škola...)
    Komerčný
    Osobné

    Výhody webových stránok:

    Malý objem informácií
    ("pľúca")
    Vhodné na prezeranie v rôznych
    OS.
    Dynamický.
    Interaktívne.

    Kroky vytvorenia webovej stránky:

    1.
    2.
    3.
    Vytvorte webovú stránku lokálne
    počítač.
    test (skontrolovať
    správna prevádzka).
    Uverejniť online -
    vyberte hostingový server
    (platené alebo bezplatné).

    Programy na vytvorenie stránky:

    1) najjednoduchší textový editor (bez
    formátovanie textu):
    Zápisník
    2) prehliadač na prezeranie stránok:
    internet Explorer
    3) Program na spracovanie obrazu:
    photoshop

    Vizuálne webové editory

    Vytvorenie webovej stránky v HTML je veľmi náročné
    prácne, špeciálne
    vedomosti.
    Existujú vizuálne webové editory
    (programy) na vytváranie webových stránok.
    Práca na princípe WYSIWYG
    (to, čo vidíte, je to, čo dostanete).

    Štruktúra webovej stránky

    10. Tagy

    Vzhľad webovej stránky nastavujú administrátori
    príkazy - značky, ktoré sú
    uhlové konzoly< >
    Tagy môžu byť jednoduché (neopakujúce sa) resp
    spárované (nádoby): pred uzavretím
    kontajnerová značka sa píše s lomkou (/)

    Štítky sú napísané anglickými písmenami (veľké,
    malými písmenami).

    11. Štruktúra webovej stránky

    Celý HTML kód stránky
    umiestnené vo vnútri hlavnej
    kontajner:
    .
    Web stránka je rozdelená na
    2 logické časti:
    nadpis (HEAD)
    obsah (TELO).

    12. Názov webovej stránky

    Názov webovej stránky je zabalený v kontajneri.
    Obsahuje názov dokumentu a pomocné informácie o stránke
    (napríklad typ kódovania), ktorý na to prehliadač používa
    správne zobrazenie.
    Názov webovej stránky je obsiahnutý v kontajneri<ТITLE> A
    zobrazené v hornom riadku okna prehliadača pri prezeraní
    stránky.

    <ТITLЕ>Počítač

    13. Písanie šablóny webovej stránky



    <ТITLЕ>Počítač

    14. Hlavný obsah webovej stránky

    Hlavný obsah stránky je umiestnený v
    kontajner .
    Môže obsahovať: text, tabuľky, priebeh
    reťazce, obrázky, odkazy, zvukové súbory...
    Dajme na stránku text „Všetko o počítači“:
    Všetko o počítači

    15. Šablóna webovej stránky



    <ТITLЕ>Počítač


    Všetko o počítači

    16.

    17. Ako uložiť webovú stránku

    1. Vytvorte špeciálny priečinok pre lokalitu a
    uložiť všetky súbory lokality do tohto priečinka.
    2. Uložte webovú stránku ako súbor s
    s názvom index.html je titulná strana
    web (prvýkrát načítaný do prehliadača)
    Prípony súborov webovej stránky - .htm
    alebo.html

    18. Vytvárame našu webovú stránku….

    Je potrebné rozlišovať medzi názvom súboru index.html - pod
    v ktorom je webová stránka uložená v súbore
    systému a skutočný názov webovej stránky
    "Počítač" - zobrazí sa v hornom riadku
    okná prehliadača a najskôr analyzovať
    vyhľadávače.
    Názov webovej stránky musí byť maximálny
    stupeň relevantnosti pre jeho obsah.
    1. Zadajte HTML kód webovej stránky do programu Poznámkový blok.
    2. Uložte súbor ako index.html do priečinka
    stránky. Vyberte typ súboru - "Všetky súbory".
    3. Otvorte tento súbor v prehliadači na zobrazenie.

    19.

    20. LEKCIA č.2

    21. Lekcia 2: Formátovanie textu na webovej stránke

    22. Formátovanie textu

    Aj keď stránka nie je príliš atraktívna: malá tlač a čierny text
    biele pozadie. Ale pomocou značiek môžete text ozdobiť.
    1. Nadpisy: značky z<Н1>(najväčší) do<Н6>(najmenší).
    <Н1>Všetko o počítači
    2. Písmo (FONT). Niektoré značky majú atribúty - názvy vlastností, môže
    nadobudnúť určité hodnoty.
    FONT face="Arial" - tvár písma
    veľkosť = 4
    - veľkosť
    color="red" - farba
    3. Zarovnanie (ALIGN). Text je zvyčajne zarovnaný doľava
    je však zvykom umiestniť nadpis do stredu.
    ALIGN="vľavo",
    ALIGN="vpravo",
    <Н1 ALIGN="center">Všetko o počítači
    ALIGN="stred"

    23. Farba písma

    Hodnotu atribútu COLOR je možné nastaviť 2 spôsobmi:
    a) názov farby (napríklad „červená“, „zelená“, „modrá“ atď.),
    b) jeho hexadecimálnu hodnotu RGB "#RRGGBB", kde
    prvé dve hexadecimálne číslice určujú intenzitu
    červená (červená), ďalšie dve sú intenzita zelenej (zelená) a
    posledné dve sú intenzita modrých (modrých) farieb.
    Minimálna intenzita farby je uvedená v hexadecimálnej sústave
    číslo 00 a maximum je FF. Modrá farba = "#0000FF".
    Modrú farbu nadpisu teda môžete nastaviť pomocou značky FONT
    atribút COLOR:
    <Н1 ALIGN="center">Všetko o počítači

    24.

    25. Formátovanie textu

    4. Vodorovná čiara sa oddelí
    názov od zvyšku obsahu
    stránky s jednou značkou
    .
    5. Odseky:<Р>. Pri pohľade v
    odseky sú v prehliadači od seba oddelené
    iné intervaly. Za každý odsek
    môžete nastaviť konkrétny typ
    zarovnanie.

    26. Praktická práca 3.8 Školiace miesto "Počítač"

    Formátovanie počiatočného textu
    stránky:
    1) Vytvorte a zarovnajte 2 odseky (úloha 3)
    2) Zvýraznite nadpis stránky farbou a
    oddeľte ho vodorovnou lištou
    (úloha 4)

    27.

    28. LEKCIA 3

    29. Lekcia 3: Vkladanie obrázkov do webových stránok

    30. Vložte obrázky

    Webové stránky môžu obsahovať grafické súbory 3 formátov -
    GIF, JPG a PNG. Ak je obrázok uložený v inom formáte, potom
    musia byť najprv prevedené na jeden z nich
    formátov.
    Značka sa používa na vloženie obrázka. s prívlastkom
    SRC, ktorý označuje, kde je súbor uložený
    lokálnom počítači alebo na internete.
    1) obrázok na lokálnom počítači v priečinku s webom:

    2) obrázok je v inom priečinku na lokálnom počítači:

    3) obrázok sa nachádza na vzdialenom serveri na internete:

    31. Vysvetľujúci text. Umiestnenie obrázku v texte.

    Ilustrácie na webových stránkach sa stali nevyhnutnými
    dizajnový prvok. Používatelia však, aby
    ušetrite čas niekedy zakážte sťahovanie prehliadača
    grafické obrázky a texty len na čítanie.
    Preto, aby sa nestratil zmysel stránky, namiesto kreslenia
    vysvetľujúci text by sa mal zobrazovať s atribútom ALT

    Pozícia postavy v texte - definuje atribút ALIGN
    tag : THOR, STRED, DOLE, VĽAVO, VPRAVO.
    ALIGN="vpravo">

    32. Pohľad na hotové miesto

    33. Kód webovej stránky


    Počítač


    Všetko o počítači




    Na tejto stránke môžete získať rôzne informácie o
    počítač, jeho softvér a ceny za počítač
    príslušenstvo.


    Terminologický slovník vás zoznámi s počítačom
    podmienok a môžete tiež vyplniť dotazník.



    34. Lekcia 4

    35. Skúšobná práca č.3

    1.
    2.
    3.
    4.
    5.
    6.
    7.
    8.
    9.
    10.
    Čo je to webová lokalita?
    Typy stránok.
    Ako sa webové stránky spájajú do webových stránok?
    Čo sú značky? tag kontajner? Napíšte hlavný kontajner
    internetové stránky.
    Aká je logická štruktúra webovej stránky?
    Uveďte 5 značiek formátovania stránky.
    Čo je atribút značky?
    Aké sú spôsoby nastavenia farieb na webovej stránke?
    Aké značky sa používajú na zadanie názvu? Formátovanie
    písmo? Zadanie odseku?
    Aký tag a jeho atribúty sa používajú na vkladanie obrázkov?

    36. Lekcia 4. Hypertextové odkazy na webových stránkach

    37.

    Hypertextové odkazy umožňujú sťahovanie
    prehliadať ďalšie súvisiace webové stránky
    z predchádzajúceho.
    Hypertextový odkaz pozostáva z 2 častí: adresa
    a referenčný ukazovateľ.
    Hypertextový odkaz je nastavený na univerzálny
    tag s atribútom HREF (he
    určuje, ktorý súbor je uložený
    požadovaná webová stránka):
    ukazovateľ odkazu

    38. Typy hypertextových odkazov

    1) interné:
    Ukazovateľ
    odkazy
    2) externé:
    názov_súboru.html"> Ukazovateľ odkazu

    39. Hypertextové odkazy

    Ukazovateľ - viditeľná časť
    hypertextové odkazy: text alebo obrázok

    40. Adresová časť hypertextových odkazov

    Prejdite na iné webové stránky:
    ukazovateľ odkazu
    Otvoriť obrázok v prehliadači:
    Obrázok
    Vypočujte si zvuk (spustíte vstavaný prehliadač
    hráč):
    Zvuk
    Uložiť súbor (spustí vstavaný prehliadač
    správca sťahovania súborov):
    Stiahnuť súbor

    41. E-mailový hypertextový odkaz

    Tento typ hypertextového odkazu je
    špeciálna nádoba


    ”>Náš e-mail

    42. Pohľad na hotovú stránku lokality

    43. Kód stránky webovej stránky


    Počítač


    Všetko o počítači




    Na tejto stránke môžete získať rôzne informácie o počítači, jeho softvéri
    poskytovanie a ceny počítačových komponentov.


    Terminologický slovník vás zoznámi s počítačovými pojmami, ako aj vás
    môžete vyplniť formulár.


    [Programy]  
    [Slovník]  
    [Príslušenstvo] 
    [Dotazník]



    ">E-mail:


    44. Lekcia 5

    45. Lekcia 5: Zoznamy na webových stránkach

    46. ​​Typy zoznamov

    Číslované
    Označené
    Zoznamy výrazov (ako v slovníku)
    Vnorené zoznamy

    47. Číslovaný zoznam

    Zoznam - v kontajneri
    Položka zoznamu – značka

  • Atribút TYPE je typ číslovania (arab
    čísla; I - Roman; a - latinčina
    malými písmenami)

    1. Systémové programy
    2. Aplikačné programy
    3. Programovacie systémy

    48. Zoznam s odrážkami

    Zoznam - v kontajneri
    Položka zoznamu – značka

  • Atribút TYPE je typ značiek („disk“ je disk,
    "štvorec" - štvorec, "kruh" - kruh)

    • Textové editory
    • Grafický editor
    • Tabuľky
    • Systémy správy databáz

    49. Zoznam pojmov

    Zoznam - v kontajneri

    Položka zoznamu – značka

    Termín je napísaný ako prvý, potom
    jeho definícia (ako v slovníku)

    50. Lekcia 6

    51. Lekcia 6: Interaktívne formuláre na webových stránkach

    52. Pojem interaktívna forma

    Na komunikáciu s návštevníkmi webu
    tvorcovia na webovej stránke
    interaktívne formuláre.
    Formuláre obsahujú rôzne prvky
    ovláda:
    textové polia
    rozbaľovacie zoznamy
    vlajky
    vypínače...

    53. Textové pole

    hlavný kontajner

    Textové pole - pre zadávanie textu z klávesnice: tag
    s atribútmi:
    TYPE="text" – typ obsahu (text)
    NAME="____" – názov poľa
    SIZE="40" – dĺžka vstupného poľa (v znakoch)

    - oddeľovač riadkov (presuňte kurzor na nový
    riadok)

    54. Prepínače (prepínače)

    Okrúhle tlačidlo na výber jedného z niekoľkých
    možnosti odpovede:
    TYPE="radio"
    Všetci členovia tejto skupiny musia mať
    rovnaké meno: NAME="skupina"
    Atribúty VALUE obsahujú možnosti
    odpovede: VALUE="študent"

    55. Vlajky

    Štvorcové pole na výber viacerých odpovedí z
    navrhované možnosti:
    TYPE="zaškrtávacie políčko"
    Každý prvok tejto skupiny musí mať svoj vlastný názov:
    NAME="box1", NAME="box2",
    …..
    Atribúty VALUE obsahujú možnosti výberu odpovedí:
    VALUE=“WWW”, VALUE=”e-mail”, ….
    Každá HODNOTA má svoju vlastnú odpoveď.
    www

    56. Zoznamy

    Na vytvorenie rozbaľovacieho zoznamu
    použite nádobu

    V ňom každý prvok zoznamu
    daný tagom

    • SÚVISIACE ČLÁNKY