Html oldal készítése jegyzettömbben: magyarázat a bábokhoz. Fejléc igazítása középre

1. feladat: Alapvető HTML fájlok létrehozása

A HTML-fájl létrehozásához tegye a következőket:

    Hozzon létre egy mappát HTML, amelyben elmentjük a létrehozott weblapokat.

    Indítsa el a szabványos Jegyzettömb programot.

    Írja be a szerkesztő ablakba a HTML fájl legegyszerűbb szövegét:

Képzési HTML fájl

Keddi órarend

    Mentse el a fájlt RASP.HTM néven.

    A létrehozott weboldal megtekintéséhez töltse le a Microsoft Internet Explorer böngészőt.

    Megnyitás a böngésző menüjében Fájl(Fájl), Nyisd ki(nyisd ki), Kilátás(Áttekintés- Böngésszen) és keresse meg a RASP.HTM fájlt a KURS mappában, és töltse fel. Győződjön meg arról, hogy a weblap neve (HTML oktatóprogram) megjelenik a böngésző felső állapotsorában.

2. feladat.A képernyőn megjelenő szöveg elrendezésének szabályozása

Információ.

HTML dokumentumok megjelenítésekor a böngészők automatikusan szöveget helyeznek el a képernyőn, szedése nélkül vegye figyelembe a fájlban előforduló sortöréseket és egymást követő szóközöket.

    Ha szükséges, kövesse a p.p. 5-6 feladat 1.

    Nyissa meg a weblap eredeti forrását - a böngésző menüjében Kilátás(Kilátás), Forrás (mintHTML) megnyílik egy ablak a szabványos Jegyzettömb programmal, amelyben a weboldal HTML parancsokkal jelenik meg.

    Módosítsa a szöveget a HTML fájlban az "Ütemterv", "osztályok", "kedd" szavak különböző sorokba helyezésével:

Képzési HTML fájl

Menetrend

osztályok

kedden

    Mentse el a RASP.HTM fájl módosításait a parancsok segítségével Fájl(Fájl), Megment(Megment). Zárja be a Jegyzettömböt.

    A Microsoft Internet Explorer segítségével tekintse meg az újonnan letöltött weboldalt az F5 billentyű vagy a parancsok használatával Kilátás(Kilátás), Frissítés (Frissítés). Változott a képernyőn megjelenő szöveg képe?

jegyzet

A jövőben, miután változtatásokat végzett a weboldalon, mindig kövesse a 4-5.

3. feladat Sor- és bekezdéstörés címkék

Információ.

Vannak speciális parancsok, amelyek soremelést hajtanak végre, és beállítják az új bekezdés elejét. Ezenkívül van egy parancs, amely megakadályozza, hogy a böngészőprogram bármilyen módon módosítsa a szöveg formázását, és lehetővé teszi a szöveges fájl megadott töredékének pontos reprodukálását a képernyőn.

Soremelés címke
elválaszt egy sort a következő szövegtől vagy grafikától. bekezdéscímke

Szintén elválasztja a sort, de egy üres sort is hozzáad, amely vizuálisan kiemeli a bekezdést. Mindkét címke egyszemélyes.

    Módosítsa a HTML-fájl szövegét:

Képzési HTML fájl

Menetrend

osztályok

kedden

    4. Mentse el a változtatásokat a RASP.HTM fájlba.

    Az újonnan kapott weblap megtekintéséhez használja a Microsoft Internet Explorert Hogyan változott a képernyőn megjelenő szöveg?

4. feladat Szövegtöredékek kiválasztása

Információ.

A szövegválasztó címkék lehetővé teszik az egyes karakterek és szavak megjelenítésének szabályozását. Három szövegkiválasztó címke létezik:

kiemelni bátor,

kiemelni dőlt betűvel

kiemelni aláhúzás.

Képzési HTML fájl

Menetrend osztályok kedden

2. Tekintse meg az újonnan kapott weblapot.

Lehetséges kombinált betűtípusok használata:

Menetrend osztályok kedden

Ugyanakkor emlékeznie kell a következő szabályra a kombinált címkék írásakor:

<Тэг-1> <Тэг-2> Címke-2>

hibás beírás

5. feladat: Címsorstílusok használata

Információ.

Kétféleképpen szabályozhatja a böngésző által megjelenített szöveg méretét:

    címsor stílusok használatával,

    a fő dokumentum méretének vagy az aktuális betűtípus méretének beállítása.

Hat címke van (H1-től H6-ig). Minden címkének van egy adott stílusa, amelyet a böngésző beállításai határoznak meg. A H1 stílus a legnagyobb.

    Módosítsa a RASP.HTM fájlt:

Képzési HTML fájl

Menetrend

osztályok kedden

    Tekintse meg az újonnan kapott weboldalt.

5. feladat Az aktuális betűtípus méretének beállítása.

Információ.

font tag lehetővé teszi az aktuális betűtípus méretének beállítását a szöveg egyes helyein. Az aktuális betűtípus-beállítási tartomány 1 és 7 között van.

    Módosítsa a RASP.HTM fájlt:

Képzési HTML fájl

Menetrend

órák keddre

    Módosítsa saját maga a "class on Tuesday" szöveg betűméretét a címke használatával .

    Módosítsa egy HTML-dokumentum szövegét szövegkiválasztó címkék és sor- és bekezdéstörés címkék segítségével.

6. feladat Betűtípus és betűszín

Információ.

Címke Szabályozza a szöveg méretét, stílusát és színét. A betűtípus módosítása egyszerűen a címkéhez való hozzáadással történik ARC attribútum. Például, ha a szöveget Arial betűtípussal akarja megjeleníteni, akkor írjon .

Címke betűtípusának megváltoztatása attribútum használható SZÍN=X.

X helyett vagy a szín nevét (idézőjelben) vagy hexadecimális értékét kell helyettesíteni. Ha egy színt hexadecimális számmal ad meg, ezt a színt három összetevőre bontva ábrázolhatja:

piros (R), zöld (G), kék (B), amelyek mindegyikének értéke 0 és FF között van.

Példák az RGB formátumú színes rögzítésre a táblázatban:

Asztal 1

Szín

Szín

Ibolya

Barna

narancs

türkiz

    Módosítsa a RASP.HTM fájlt:

Képzési HTML fájl

Menetrend >

órák keddre

    Módosítsa saját maga a dokumentum méretét, színét, betűtípusát és szövegstílusát.

7. feladat Szöveg vízszintes igazítása

Információ.

A HTML-címkék szabályozzák a szöveg vízszintes igazítását. Ha nem ad meg igazítási módot, a dokumentum minden eleme balra lesz igazítva, és szaggatott jobb margó lesz (lásd: 2. ábra).

A modern böngészők a szövegigazítás attribútumot használják IGAZÍTÁS=, amely a bekezdés- vagy címcímkékbe van beágyazva.

    Módosítsa a RASP.HTM fájlt:

Képzési HTML fájl

Menetrend>

órák keddre

8. feladat A háttér és a szöveg színének beállítása

Információ.

A háttér, szöveg megjelenítésénél a böngészők az alapértelmezés szerint beállított színeket használják - ezeket a böngésző beállításai adják meg. Ezek a színek a HTML-fájl elején vannak beállítva a címkében . A színbejegyzés hasonló a betűtípus színéhez (lásd: 1. táblázat, 12. bekezdés). A BGCOLOR= attribútum az oldal háttérszínét állítja be, a TEXT= a teljes oldal szövegszínét, a LINK= és a VLINK= a nem látogatott és a meglátogatott hivatkozások színét (az utolsó két paraméterről később lesz szó).

    Módosítsa a RASP.HTM fájlt:

Képzési HTML fájl

BGCOLOR="#FFFFCC" SZÖVEG="#330066">

Menetrend>

órák keddre

9. feladat.

    Kísérletezzen a létrehozott dokumentummal. Az ablak átméretezése közben nézze meg, hogy a böngésző hogyan jeleníti meg a szöveget kényszerített sortörésekkel. Mi történik, ha az ablak annyira összezsugorodik, hogy egyetlen szó sem fér bele?

    Hozzon létre saját HTML-dokumentumot saját maga. Legyen ez egy rövid történet önmagáról és a hobbijairól.

Sziasztok kedves blogolvasók! Folytatjuk a "Webhely létrehozása a semmiből" részt, és különösen a címkék témáját ... És ma megvizsgáljuk azokat a címkéket, amelyek bármely weboldalon megtalálhatók - , és . Van még egy címke, aminek minden HTML dokumentumban szerepelnie kell, és amelyről az előző cikkek egyikében már írtam - ezért nem térünk ki rá.

A rovat korábbi cikkeiben írtam egy üres fájl létrehozásáról html formátumban. Valójában a profi cikkben használták (itt alkalmazták a címcímkéket). Most közvetlenül szerkesztjük ezt a fájlt teljes leírással.

És kezdjük a cikket a létrehozott fájl szerkesztésével. Én személy szerint index.html-nek neveztem el, de a név bármi lehet. Nyissa meg bármilyen szövegszerkesztővel (jobb a Notepad++ használata, mert van benne kódkiemelés és egyéb hasznos kütyük). És azonnal adjon hozzá címkéket , és pontosan abban a sorrendben, ahogy írták. Ne felejtse el bezárni őket a képernyőképen látható módon. A dokumentum így fog kinézni:

Most fontolja meg az egyes címkék jelentését külön-külön. Nem csoda, hogy mindenkiben benne vannak. HTML dokumentum.

Címkefunkciók

Tehát a címke egy tartály(). Benne van a weboldal összes látható és láthatatlan tartalma (beleértve a címkéket is és ). Nyitási címke közvetlenül a Doctype deklaráció és a záró után következik a dokumentum végén található. Így egyértelművé teszi a böngésző számára, hogy hol kezdje el a dokumentum feldolgozását, és hol fejezze be.

Elméletileg ő maga is megértheti, hogy mit és hogyan. Végül ? Ez egy HTML nyelvű fordító, és nem valószínű, hogy a dokumentum közepétől kezdi el a feldolgozást, és mielőtt a végére érne, befejezi. A kérdés persze vitatható, de mindig is úgy gondoltam (és most sem adom fel a véleményemet), hogy ezt a címkét kötelező megírni.

Még ha figyelembe vesszük, hogy ennek a címkének a funkciója csak az határoló tartalmat, saját attribútumai vannak (amelyeket most vagy egyáltalán nem, vagy rendkívül ritkán használnak). A különböző források egymástól eltérő attribútumokat jeleznek, ezért nem merem előadni a helyes verziót.

Az egyetlen dolog, amit biztosan állíthatok, az az, hogy a legtöbb attribútumot a HTML 4.01 nem támogatja, vagy nem kívánatos. Azért mondok egy példát. - eszköztipp bárhol a dokumentumban. Például, amikor az egeret egy kép fölé viszi, előugró szöveg jelenhet meg. A címke esetében is:

És a következőket fogja látni, ha az egérmutatót egy ilyen tartalmú dokumentum fölé viszi:

Célszerű a title attribútumot nem a címkében használni , hanem az oldal bármely más meghatározott területén. Egyrészt kényelmes, másrészt a keresőmotorok jobban kezelik webhelyét. Ez a címke közvetlenül nem befolyásolja az erőforrás-optimalizálást. Tovább megyünk.

Címke funkció

És a következő a sorban címke . Minden olyan technikai információt tartalmaz az oldalról, amely a böngésző és a keresők segítését szolgálja. A címke egy konténercímke, és közvetlenül utána következik , csak az előzővel ellentétben, a záró tag nem a dokumentum végén, hanem a nyitó címke előtt jelenik meg .

Milyen információk találhatók benne ? De egyik sem. A címkén belül minden csak az oldal forráskódjának megtekintésével érhető el az emberi szem számára. A címke összes tartalma a következőnek szól keresőmotorok és böngészők. Az egyetlen dolog, amit valahogy látni lehet, az a címke , amely a weblap ablakának címéért felelős. Íme egy példa:</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>Az ikon utáni szöveg a címke tartalma <title>. Most pedig nézzük a tartalmat. <head>, amit nem látunk, de ami nagyon fontos része <b>az oldal létrehozása és népszerűsítése.</b> Először is ez a vonal</p><p> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> </p><p>Ez a meta tag a számára <b>oldal tartalomtípusa</b>(Tartalom típus). Ebben az esetben ez egy UTF-8 kódolású html kód (content="text/html; charset=UTF-8"). Ezután jön a fent leírt címcímke. Ezután jöjjenek a címkével kezdődő sorok <link>. Külső dokumentumra mutató hivatkozást jelez. Például a vonal</p><p> <link href="http://сайт/.../style.css" rel="stylesheet" media="screen" type="text/css" /> </p><p>azt jelzi, hogy a (rel="stylesheet") fájl (type="text/css") van csatlakoztatva, ami ilyen-olyan címen található (a sor hosszának csökkentése érdekében a cím felét pontokra cseréltem) . Miután a böngésző feldolgozta ezt a karakterláncot, meghatározza, hogy hol lehet elérni <b>lépcsőzetes stíluslapok</b>.</p> <p>Általánosságban elmondható, hogy a fejcímkében sok olyan információ található, amelyről a végtelenségig lehet beszélni. Az utolsó dolog, amit érdemes megjegyezni (különösen a esetén), a leírási címkék, kulcsszavak és kanonikus jelenléte. használom <b>plugin All in One SEO Pack</b>, tehát jelen vannak belül <head>.</p> <p>Mint tudod, minden nagyszerű mindig kicsiben kezdődik. Ha érdekli a válasz arra a kérdésre, hogy hogyan hozhat létre weboldalt jegyzettömbön keresztül, akkor biztosan hallott erről a lehetőségről valahol. Ez valóban lehetséges. De érdemes rögtön megemlíteni, hogy nagy valószínűséggel jelenleg senki sem fog modern, dinamikus interaktív oldalt létrehozni jegyzettömbön keresztül, mivel erre vannak speciális programok, amelyek nagyban felgyorsítják és leegyszerűsítik a fejlesztési folyamatot. De teljesen lehetséges egy teljes értékű weboldal létrehozása.</p><b>Hogyan készítsünk weboldalt jegyzettömbben</b><br>Először is egy kis ismeret szükséges az elméletben és az általános kifejezésekben. A weboldalak túlnyomó többsége közönséges szöveges dokumentum, amelyet különleges módon terveztek - a hiperszöveg jelölőnyelve, rövidítve HTML. Vannak, akik a HTML jelölést programozási nyelvnek minősítik, de ez nem igaz. <p>A HTML csak egy módja a dokumentumjelölés szabványosításának, amelyet a böngészők egyedileg értelmeznek, hogy felhasználóbarát formában jelenjenek meg a számítógép képernyőjén. A HTML nyelv fő eszköze a speciális szerkezeti elemek, amelyek segítségével készül a dokumentum. Ezeket leíróknak vagy címkéknek nevezik.</p><p>Általában a címke az űrlap konstrukciója <table>Tehát a címke ezzel kezdődik< после которого следует название тега table и вся конструкция завершается знаком >. A címkék párban állnak rendelkezésre, mint például a szöveg félkövérré tétele <b>és</b>és újsorként párosítva <br>. Páros címkék használata esetén nyitócímkeként kell használni <b>, és bezárás</b>. A záró címke egy leíró perjellel /.</p><p>Fontolja meg a címkék fő típusait és célját.</p><ul><li><span><i>Elem <b><!DOCTYPE html> </b>. </i>Állítsa az oldal legelejére, és arra szolgál, hogy megmondja a böngészőnek, hogyan értelmezze ezt a dokumentumot. Nem kötelező, de nagyon kívánatos az oldalon, hogy elkerüljük a megjelenítéssel kapcsolatos esetleges problémákat. <br></span></li><li><span><i>Címke <b><html> </b>. </i> Ez egy páros címke, és két részből áll <html>és</html>. A webhely minden oldala ezzel a címkével kezdődik és ezzel végződik. <br></span></li><li><span><i>Címke <b><head> </b>. </i> Ez is egy páros címke, és két részből áll <head>és</head>. Ez a címke különféle fontos információkat tartalmaz az oldalról: a címet, a használt tervezési stílusokra mutató hivatkozásokat, a mellékelt szkripteket, speciális metaadatokat. <br></span></li><li><span><i>Címke <b><title> </b>. </i> <title>ésés a címke belsejében található . Ez a címke határozza meg az oldal címét, amellyel a böngészőben látható lesz.

  • Címke . Ez egy páros címke, két részből áll ésés követi a címkét Az oldalon. Az <body> címkében található, amely tartalmazza a böngészőben az oldalon megjelenő összes információt.
  • Címke . Egyedülálló. A dokumentum sortörésének jelzésére szolgál.
  • Címke . Párosított címkékre utal, más címkéktől kissé eltérő formában íródik, és hivatkozások létrehozására szolgál. Lényeges eleme a HTML nyelv egész koncepciójának, valamint az Internet egészének.
  • Címke

    . A párosított címkékre utal, és két részből áll. Segítségével szöveges bekezdés készül.

  • címkéket

    ,

    ,

    ,

    ,
    ,
    . Párosított címkékhez tartoznak, mivel például két címkéből állnak

    és

    . Ezek a címkék hat szintű alcímek létrehozására szolgálnak, és egyben megmutatják a bennük található szöveg fontosságát a teljes dokumentumhoz képest.

  • Címke . Ez is egy páros címke, két részből áll ésés a betűstílust félkövérre állítja.
  • Összességében körülbelül száz címke van, de a figyelembe vett tíz már elegendő ahhoz, hogy az oldal legegyszerűbb oldalát egy jegyzetfüzetben megtervezzük. Alapvető dokumentumcímkék , , , <body>szigorú sorrendben osztják szét. A címke belsejében <body>a többi leíró a HTML nyelv szabványain belül eltérő sorrendben lehet. Ezt a legkönnyebben úgy érthetjük meg, ha létrehozunk egy egyszerű weboldalt. <ol><li><span>Indítsa el a Jegyzettömböt, és a legelső sorában állítsa be az elemet<!DOCTYPE html>, amely megmondja a böngészőnek, hogyan értelmezze a dokumentumot. <p> <!DOCTYPE html></p></span></li><li><span>Hozzon létre egy új sort, és adjon hozzá egy pár címkét <html>. Fordítsa le a záró címkét</html> két sorral lejjebb. <p> <!DOCTYPE html><br><html></p></span></li><li><span>Adjon hozzá egy pár címkét <head>sorban a címkék között <html>és fordítsa le a záró címkét</head> két sorral lejjebb. <p> <!DOCTYPE html><br><html><br><head></p><p></head><br></html></p></span></li><li><span>Soron a címkék között <head>és</head>írj egy pár címkét <title> egy sorban.






  • Írja be weboldala címét a címkék közé és. Például így.




    Az első weboldalam

  • Vigye a kurzort a záró címke utáni sorraés csinálj soremelést. Írjon be egy pár címkét a megjelenő üres sorba .




    Az első weboldalam


  • Készítsen kettős fordítást a belső címkék között és. A megjelenő sorba írja be a párosított címcímkét

    . Írja be a címke belsejébe

    oldal alcíme.




    Az első weboldalam


    Rólam



  • A záró címcímke utánvégezzen sortörést, és állítsa be a páros bekezdéscímkéket az új sorba. Szöveg beszúrása közéjük. Például igen.




    Az első weboldalam


    Rólam


    A nevem Ivanov Ivan. A honlapomat készítem.



  • Az utó- és vezetéknevet egy pár címkébe helyezze hogy merészek legyenek.




    Az első weboldalam


    Rólam


    A nevem Ivanov Iván. A honlapomat készítem.



  • A bekezdéscímke bezárása után

    végezzen soremelést, és írja be a pár címkét az új sorban

    . Írjon be szöveget a címkék közé.




    Az első weboldalam


    Rólam


    A nevem Ivanov Iván. A honlapomat készítem.


    A haladásom



  • A záró felirat utáncsináljon ismét egy sortörést, írja be a páros bekezdéscímkét, és írjon tetszőleges szöveget ezek közé a címkék közé.




    Az első weboldalam


    Rólam


    A nevem Ivanov Iván. A honlapomat készítem.


    A haladásom




  • A cikkben felsorolt ​​címkék közül kettő maradt feltáratlan – soremelés
    és a legfontosabb linképítő tag
    . Alkalmazzuk őket. Az utolsó záró címke előtt írjon be egy leírót
    , és között
    és

    típusú konstrukció. A következőket kell beszerezned.




    Az első weboldalam


    Rólam


    A nevem Ivanov Iván. A honlapomat készítem.


    A haladásom


    A HTML alapszintaxisát elsajátították, és elkészült a leendő webhely első oldala.
    A képzés során a telephely anyagait használták fel



  • Idézetek között egy címkében írja be annak az oldalnak a címét, amelyre hivatkozni fog. Címke előtt beírhatja a Link szót, és a címkék közé ésírja be az oldalon megjelenő szöveget.




    Az első weboldalam


    Rólam


    A nevem Ivanov Iván. A honlapomat készítem.


    A haladásom


    A HTML alapszintaxisát elsajátították, és elkészült a leendő webhely első oldala.
    A képzés során a telephely anyagait használták fel

    Link: webhely



  • Ezen befejezhető az oldal legegyszerűbb oldalának elkészítése. Elvileg a 9. lépésben is be lehetett volna fejezni, de ha komolyan gondolja a HTML nyelv elsajátítását, akkor a további gyakorlás nem lesz felesleges. Mentse el az oldalt *.html kiterjesztéssel, és bármelyik böngészőben megnyithatja munkája eredményének megtekintéséhez. Ha mindent helyesen csinált, akkor valami ilyesmit kell látnia az alábbiakhoz.
  • Ha a cikk elolvasása után nem fogyott el az elhatározása, hogy egy webhelyet hozzon létre, akkor feltétlenül ismerkedjen meg a HTML nyelv teljes szintaxisával, és tanulja meg a CSS lépcsőzetes stílusok használatát oldaltervezéshez.

    Webhelyek fejlesztése HTML Hypertext Markup Language használatával

    8. osztály

    1. lecke Weboldal szerkezete.

    Weboldal koncepció

    Információk a világhálón
    weboldalak formájában tárolva.
    A weboldal felépítésében hasonló a
    folyóirat egy témában ill
    probléma. Hogyan épül fel egy magazin
    nyomtatott oldalak, és a webhely áll
    számítógépes weboldalakról.
    A weboldalakat hiperhivatkozások kapcsolják össze.

    Weboldal típusok

    hivatalos (kormány,
    Duma, iskola...)
    Kereskedelmi
    Személyes

    A weblapok előnyei:

    Kis információmennyiség
    ("tüdő")
    Megtekintésére alkalmas különböző
    OS.
    Dinamikus.
    Interaktív.

    A weboldal létrehozásának lépései:

    1.
    2.
    3.
    Webhely készítés helyben
    számítógép.
    teszt (ellenőrizd
    helyes működés).
    Online közzététel -
    válasszon hosting szervert
    (fizetős vagy ingyenes).

    Programok az oldal létrehozásához:

    1) a legegyszerűbb szövegszerkesztő (anélkül
    szöveg formázása):
    Jegyzetfüzet
    2) böngésző az oldalak megtekintéséhez:
    internet böngésző
    3) Képfeldolgozó program:
    photoshop

    Vizuális webszerkesztők

    Weboldal készítés HTML-ben nagyon
    fáradságos, különleges
    tudás.
    Vannak vizuális webszerkesztők
    (programok) weboldalak készítéséhez.
    Dolgozzon a WYSIWYG elvén
    (azt kapod amit látsz).

    Weboldal szerkezete

    10. Címkék

    A weblap megjelenését a rendszergazdák állítják be
    parancsok - címkék, amelyek
    szögletes zárójelek< >
    A címkék lehetnek egyszeresek (nem ismétlődőek), ill
    párosítva (konténerek): zárás előtt
    a tárolócímke perjellel (/) van írva

    A címkéket angol betűkkel írják (nagy,
    kisbetűs).

    11. Weboldal szerkezete

    Az oldal teljes HTML kódja
    a fő belsejébe helyezve
    tartály:
    .
    A weboldal fel van osztva
    2 logikai rész:
    címsor (HEAD)
    tartalom (BODY).

    12. Weboldal címe

    A weboldal címe egy tárolóba van csomagolva.
    Tartalmazza a dokumentum címét és az oldallal kapcsolatos súgóinformációkat
    (például a kódolás típusa), amelyet a böngésző használ
    helyes megjelenítés.
    A weboldal címét a tároló tartalmazza<ТITLE> és
    megtekintéskor a böngészőablak felső sorában jelenik meg
    oldalakat.

    <ТITLЕ>Számítógép

    13. Weboldalsablon írása



    <ТITLЕ>Számítógép

    14. A weboldal fő tartalma

    Az oldal fő tartalma be van helyezve
    tartály .
    Tartalmazhat: szöveget, táblázatokat, futást
    karakterláncok, képek, linkek, hangfájlok...
    Tegyük fel az oldalra a "Mindent a számítógépről" szöveget:
    Minden a számítógépről

    15. Weboldal sablon



    <ТITLЕ>Számítógép


    Minden a számítógépről

    16.

    17. Weboldal mentése

    1. Hozzon létre egy speciális mappát a webhelyhez és
    mentse az összes webhelyfájlt ebbe a mappába.
    2. Mentse el a weboldalt fájlként a következővel:
    az index.html nevű a címlap
    webhely (először betöltve a böngészőbe)
    Weboldal fájlkiterjesztései - .htm
    vagy.html

    18. Elkészítjük weboldalunkat….

    Különbséget kell tenni az index.html fájlnév között - alatt
    amely egy weblap fájlban van tárolva
    rendszert, és a weboldal tényleges nevét
    "Számítógép" - a felső sorban jelenik meg
    böngészőablakok és először elemezni
    kereső motorok.
    A weboldal nevének maximumnak kell lennie
    a tartalom szempontjából való relevancia foka.
    1. Írja be a weboldal HTML-kódját a Jegyzettömbbe.
    2. Mentse el a fájlt index.html néven egy mappába
    webhely. Válassza ki a fájl típusát - "Minden fájl".
    3. Megtekintéshez nyissa meg ezt a fájlt egy böngészőben.

    19.

    20. 2. LECKE

    21. 2. lecke: Szöveg formázása egy weboldalon

    22. Szövegformázás

    Bár az oldal nem túl vonzó: kis betűkkel és fekete szöveggel
    fehér háttér. A címkék segítségével azonban díszítheti a szöveget.
    1. Címek: címkék innen<Н1>(legnagyobb) to<Н6>(a legkisebb).
    <Н1>Minden a számítógépről
    2. Betűtípus (FONT). Egyes címkék attribútumokkal rendelkeznek – tulajdonságnevek, esetleg
    felvenni bizonyos értékeket.
    FONT face="Arial" - betűtípus
    méret=4
    - a méret
    color="red" - szín
    3. Igazítás (ALIGN). A szöveg általában balra igazított
    oldalon azonban szokás a címsort középre tenni.
    ALIGN="bal",
    ALIGN="jobbra",
    <Н1 ALIGN="center">Minden, ami a számítógépről szól
    ALIGN="közép"

    23. Betűszín

    A COLOR attribútum értéke kétféleképpen állítható be:
    a) a szín neve (például "piros", "zöld", "kék" és így tovább),
    b) RGB hexadecimális értéke "#RRGGBB", ahol
    az első két hexadecimális számjegy határozza meg az intenzitást
    piros (piros), a következő kettő a zöld (zöld) intenzitása és
    az utolsó kettő a kék (kék) színek intenzitása.
    A minimális színintenzitás hexadecimálisan van megadva
    00, a maximum pedig FF. Kék szín = "#0000FF".
    Így beállíthatja a cím kék színét a FONT címkével
    COLOR attribútum:
    <Н1 ALIGN="center">Minden, ami a számítógépről szól

    24.

    25. Szövegformázás

    4. A vízszintes vonal elválik
    címet a tartalom többi részéből
    oldalak egyetlen címkével

    .
    5. Bekezdések:<Р>. Betekintéskor
    bekezdések el vannak választva egymástól a böngészőben
    egyéb intervallumok. Minden bekezdéshez
    beállíthat egy konkrét típust
    igazítás.

    26. Gyakorlati munka 3.8 Képzési hely "Számítógép"

    Kezdő szöveg formázása
    oldalak:
    1) Hozzon létre és igazítson 2 bekezdést (3. feladat)
    2) Jelölje ki az oldal címét színnel és
    vízszintes sávval válassza el
    (4. feladat)

    27.

    28. 3. lecke

    29. 3. lecke: Képek beszúrása weblapokra

    30. Szúrjon be képeket

    A weboldalak 3 formátumú grafikus fájlokat tartalmazhatnak -
    GIF, JPG és PNG. Ha a képet más formátumban menti, akkor
    előbb át kell konvertálni ezek valamelyikére
    formátumok.
    A címke kép beszúrására szolgál. attribútummal
    SRC, amely jelzi, hogy a fájl hol van tárolva
    helyi számítógépen vagy az interneten.
    1) kép a helyi számítógépen a webhelyet tartalmazó mappában:

    2) a kép egy másik mappában van a helyi számítógépen:

    3) a kép egy távoli kiszolgálón található az interneten:

    31. Magyarázó szöveg. Az ábra helye a szövegben.

    Az illusztrációk a weboldalakon elengedhetetlenekké váltak
    design elem. Azonban a felhasználók annak érdekében
    időt takarít meg, néha letiltja a böngésző letöltését
    grafikus képeket és csak olvasható szövegeket.
    Ezért, hogy ne veszítse el az oldal jelentését, rajzolás helyett
    A magyarázó szöveget az ALT attribútummal kell megjeleníteni

    Az ábra helyzete a szövegben - az ALIGN attribútumot határozza meg
    címke : THOR, KÖZÉP, ALUL, BAL, JOBB.
    ALIGN="jobbra">

    32. Az elkészült helyszín nézete

    33. Weboldal oldal kódja


    Számítógép


    Minden a számítógépről





    Ezen az oldalon különféle információkhoz juthat
    számítógép, annak szoftverei és a számítógép árai
    kiegészítők.


    A terminológiai szótár bemutatja a számítógépet
    feltételeket, és kérdőívet is kitölthet.



    34. 4. lecke

    35. 3. sz. próbamunka

    1.
    2.
    3.
    4.
    5.
    6.
    7.
    8.
    9.
    10.
    Mi az a webhely?
    Webhelytípusok.
    Hogyan egyesülnek a weboldalak webhelyekké?
    Mik azok a címkék? címketároló? Írja be a fő tárolót
    weboldalak.
    Mi a weblap logikai felépítése?
    Soroljon fel 5 oldalformázási címkét.
    Mi az a címke attribútum?
    Hogyan lehet színeket beállítani egy weboldalon?
    Milyen címkéket használnak a cím megadásához? Formázás
    betűtípus? Beír egy bekezdést?
    Milyen címkét és attribútumait használjuk képek beszúrására?

    36. 4. lecke. Hiperhivatkozások weboldalakon

    37.

    A hiperhivatkozások lehetővé teszik a letöltést
    böngésző egyéb kapcsolódó weboldalak
    az előzőtől.
    A hiperhivatkozás 2 részből áll: cím
    és egy referenciamutatót.
    A hiperhivatkozás univerzálisra van állítva
    címke a HREF attribútummal (he
    meghatározza, hogy melyik fájl kerül tárolásra
    kívánt weboldal):
    link mutató

    38. A hiperhivatkozások típusai

    1) belső:
    Mutató
    linkeket

    2) külső:
    filename.html"> Hivatkozási mutató

    39. Hiperhivatkozás-mutatók

    Mutató – látható rész
    hiperhivatkozások: szöveg vagy kép

    40. A hiperhivatkozások cím része

    Ugrás a többi weboldalra:
    link mutató
    Kép megnyitása böngészőben:
    Kép
    Hallgassa meg a hangot (a beépített böngésző elindítása
    játékos):
    Hang
    Fájl mentése (indítja a beépített böngészőt
    fájlletöltés-kezelő):
    Fájl letöltése

    41. E-mail hiperhivatkozás

    Ez a típusú hiperhivatkozás az
    speciális tartály


    ">Az e-mailünk

    42. Az elkészült oldal oldalának megtekintése

    43. Weboldal oldal kódja


    Számítógép


    Minden a számítógépről





    Ezen az oldalon különféle információkat kaphat a számítógépről, annak szoftvereiről
    Számítógép-alkatrészek biztosítása és árak.


    A terminológiai szótár megismerteti Önt és Önt is a számítógépes kifejezésekkel
    kitöltheti az űrlapot.


    [Programok]  
    [Szótár]  
    [Kiegészítők] 
    [Kérdőív]



    ">E-mail:


    44. 5. lecke

    45. 5. lecke: Listák a weboldalakon

    46. ​​Listák típusai

    Számozott
    Felcímkézve
    Kifejezések listája (mint a szótárban)
    Beágyazott listák

    47. Számozott lista

    Lista - konténerben
    Listaelem - címke

  • A TYPE attribútum a számozás típusa (arab
    számok; I - római; a - latin
    kisbetűs)

    1. Rendszerprogramok
    2. Alkalmazási programok
    3. Programozási rendszerek

    48. Felsorolásos lista

    Lista - konténerben
    Listaelem - címke

  • A TYPE attribútum a markerek típusa (a „lemez” egy lemez,
    "négyzet" - négyzet, "kör" - kör)

    • Szövegszerkesztők
    • Grafikus szerkesztő
    • Táblázatok
    • Adatbázis-kezelő rendszerek

    49. Fogalomjegyzék

    Lista - konténerben

    Listaelem - címke

    Először a kifejezést írják le
    meghatározása (mint a szótárban)

    50. 6. lecke

    51. 6. lecke: Interaktív űrlapok weboldalakon

    52. Az interaktív űrlap fogalma

    Kommunikálni a weboldal látogatóival
    készítők a weboldalon
    interaktív űrlapok.
    Az űrlapok különféle elemeket tartalmaznak
    vezérlők:
    szöveges mezőket
    legördülő listák
    zászlókat
    kapcsolók...

    53. Szövegmező

    fő konténer

    Szövegmező - szövegbevitelhez a billentyűzetről: címke
    attribútumokkal:
    TYPE="text" – tartalomtípus (szöveg)
    NAME="____" – mező neve
    SIZE="40" – beviteli mező hossza (karakterben)

    - sorelválasztó (a kurzor áthelyezése egy új helyre
    vonal)

    54. Kapcsolók (rádiógombok)

    Kerek gomb a több közül egy kiválasztásához
    válaszlehetőségek:
    TYPE="rádió"
    A csoport minden tagjának rendelkeznie kell
    azonos név: NAME="csoport"
    VALUE attribútum választási lehetőségeket tartalmaz
    válaszok: VALUE="tanuló"

    55. Zászlók

    Négyzet alakú négyzet több válasz kiválasztásához
    javasolt lehetőségek:
    TYPE="jelölőnégyzet"
    A csoport minden elemének saját névvel kell rendelkeznie:
    NÉV="doboz1", NÉV="doboz2",
    …..
    VALUE attribútum a válaszok kiválasztására vonatkozó lehetőségeket tartalmaz:
    VALUE=„WWW”, VALUE=„e-mail”, ….
    Minden ÉRTÉKnek megvan a saját válasza.
    www

    56. Listadobozok

    Legördülő lista létrehozásához
    tartályt használjon

    Ebben a lista minden eleme
    címke által adott