Html lapas izveide piezīmju grāmatiņā: precizējums manekeniem. Centrā līdzināt galveni

1. uzdevums: pamata HTML failu izveide

Lai izveidotu HTML failu, rīkojieties šādi:

    Izveidojiet mapi HTML, kurā saglabāsim izveidotās Web lapas.

    Palaidiet standarta Notepad programmu.

    Redaktora logā ierakstiet vienkāršāko HTML faila tekstu:

Apmācības HTML fails

Otrdienas nodarbību grafiks

    Saglabājiet failu kā RASP.HTM.

    Lai skatītu izveidoto Web lapu, lejupielādējiet pārlūkprogrammu Microsoft Internet Explorer.

    Atvērt pārlūkprogrammas izvēlnē Fails(Fails), Atvērt(atvērts), Skats(Pārskats- Pārlūkot) un atrodiet RASP.HTM failu mapē KURS un augšupielādējiet to. Pārliecinieties, vai pārlūkprogrammas augšējā statusa joslā ir redzams tīmekļa lapas nosaukums (HTML apmācība).

2. uzdevums.Teksta izkārtojuma kontrole ekrānā

Informācija.

Parādot HTML dokumentus, pārlūkprogrammas automātiski izkārto tekstu uz ekrāna, neņemot ņem vērā rindiņu pārtraukumus un secīgās atstarpes, kas rodas failā.

    Ja nepieciešams, seko p.p. 5-6 uzdevumi 1.

    Atveriet Web lapas sākotnējo avotu - pārlūkprogrammas izvēlnē Skatīt(Skatīt), Avots (kāHTML) tiks atvērts logs ar standarta Notepad programmu, kurā jūsu Web lapa tiek parādīta HTML komandās.

    Mainiet tekstu HTML failā, ievietojot vārdus "grafiks", "nodarbības", "otrdiena" dažādās rindās:

Apmācības HTML fails

Grafiks

klases

otrdien

    Saglabājiet izmaiņas failā RASP.HTM, izmantojot komandas Fails(Fails), Saglabāt(Saglabāt). Aizveriet Notepad.

    Izmantojiet Microsoft Internet Explorer, lai skatītu tikko izgūto Web lapu, izmantojot taustiņu F5 vai komandas Skatīt(Skatīt), Atjaunot (atjaunot). Vai teksta attēls ekrānā ir mainījies?

Piezīme

Turpmāk pēc izmaiņu veikšanas Web lapā vienmēr izpildiet 4.–5. darbību.

3. uzdevums. Rindas un rindkopas pārtraukumu tagi

Informācija.

Ir īpašas komandas, kas veic rindiņas pārtraukumu un nosaka jaunas rindkopas sākumu. Turklāt ir komanda, kas neļauj pārlūkprogrammai jebkādā veidā mainīt teksta formatējumu un ļauj precīzi reproducēt norādīto teksta faila fragmentu ekrānā.

Rindas plūsmas tags
atdala rindiņu no nākamā teksta vai grafikas. rindkopas tags

Atdala arī rindiņu, bet pievieno arī tukšu rindiņu, kas vizuāli izceļ rindkopu. Abas atzīmes ir vienas.

    Veiciet izmaiņas HTML faila tekstā:

Apmācības HTML fails

Grafiks

klases

otrdien

    4. Saglabājiet izmaiņas failā RASP.HTM.

    Izmantojiet Microsoft Internet Explorer, lai apskatītu tikko saņemto Web lapu Kā ir mainījies teksts ekrānā?

4. uzdevums. Teksta fragmentu atlase

Informācija.

Teksta atlases tagi ļauj kontrolēt atsevišķu rakstzīmju un vārdu rādīšanu. Ir trīs teksta atlases tagi:

izcelt treknrakstā,

izcelt slīprakstā

izcelt pasvītrojums.

Apmācības HTML fails

Grafiks klases otrdien

2. Skatiet tikko saņemto Web lapu.

Ir iespējams izmantot kombinētos fontus:

Grafiks klases otrdien

Bet tajā pašā laikā jums ir jāatceras šāds kombinēto tagu rakstīšanas noteikums:

<Тэг-1> <Тэг-2> Tag-2>

kļūdains ieraksts

5. uzdevums: Virsrakstu stilu izmantošana

Informācija.

Ir divi veidi, kā kontrolēt pārlūkprogrammā parādītā teksta lielumu.

    izmantojot virsrakstu stilus,

    galvenā dokumenta vai pašreizējā fonta lieluma iestatīšana.

Ir seši virsrakstu tagi (H1 līdz H6). Katram tagam ir noteikts stils, kas norādīts pārlūkprogrammas iestatījumos. Stils H1 ir lielākais.

    Veiciet izmaiņas failā RASP.HTM:

Apmācības HTML fails

Grafiks

klases otrdien

    Skatiet tikko saņemto Web lapu.

5. uzdevums. Pašreizējā fonta lieluma iestatīšana.

Informācija.

fonta tags ļauj iestatīt pašreizējā fonta lielumu atsevišķās teksta vietās. Pašreizējais fonta iestatījumu diapazons ir no 1 līdz 7.

    Veiciet izmaiņas failā RASP.HTM:

Apmācības HTML fails

Grafiks

nodarbības otrdienai

    Mainiet fonta lielumu tekstam "class on Tuesday" pats, izmantojot tagu .

    Modificējiet HTML dokumenta tekstu, izmantojot teksta atlases tagus un rindiņu un rindkopu pārtraukumu tagus.

6. uzdevums. Burtu tips un fonta krāsa

Informācija.

Tag Nodrošina kontroli pār teksta lielumu, stilu un krāsu. Šrifta maiņa tiek veikta, vienkārši pievienojot to tagam FACE atribūts. Piemēram, lai parādītu tekstu Arial fontā, jums ir jāraksta .

Lai mainītu atzīmes fonta krāsu var izmantot atribūtu KRĀSA=X.

X vietā ir jāaizstāj vai nu krāsas nosaukums (pēdiņās) vai tās heksadecimālā vērtība. Norādot krāsu ar heksadecimālu skaitli, varat attēlot šo krāsu, kas sadalīta trīs komponentos:

sarkans (R), zaļš (G), zils (B), katra vērtība ir no 0 līdz FF.

Krāsu ierakstīšanas piemēri RGB formātā ir parādīti tabulā:

1. tabula

Krāsa

Krāsa

violets

Brūns

apelsīns

tirkīza

    Veiciet izmaiņas failā RASP.HTM:

Apmācības HTML fails

Grafiks >

nodarbības otrdienai

    Pats mainiet dokumenta izmēru, krāsu, burtveidolu, teksta stilu.

7. uzdevums. Teksta līdzināšana horizontāli

Informācija.

HTML tagi kontrolē teksta horizontālo līdzinājumu. Ja nenorādīsiet līdzināšanas metodi, visi dokumenta elementi tiks līdzināti pa kreisi un tiem būs robaina labā piemale (sk. 2. attēlu).

Mūsdienu pārlūkprogrammas izmanto teksta līdzināšanas atribūtu LĪDZINĀT=, kas ir iegulta rindkopas vai virsraksta tagos.

    Veiciet izmaiņas failā RASP.HTM:

Apmācības HTML fails

Grafiks>

nodarbības otrdienai

Uzdevums 8. Fona un teksta krāsu iestatīšana

Informācija.

Parādot fonu, tekstu, pārlūkprogrammas izmanto pēc noklusējuma iestatītās krāsas - tās nosaka pārlūkprogrammas iestatījumi. Šīs krāsas ir iestatītas tagā esošā HTML faila sākumā . Krāsu ieraksts ir līdzīgs fonta krāsai (sk. 1. tabulas 12. punktu). Atribūts BGCOLOR= norāda lapas fona krāsu, TEXT= norāda teksta krāsu visai lapai, LINK= un VLINK= definē attiecīgi neapmeklēto un skatīto saišu krāsas (pēdējie divi parametri tiks apspriesti vēlāk).

    Veiciet izmaiņas failā RASP.HTM:

Apmācības HTML fails

BGCOLOR="#FFFFCC" TEKSTS =="#330066">

Grafiks>

nodarbības otrdienai

9. uzdevums.

    Eksperimentējiet ar izveidoto dokumentu. Mainot loga izmērus, skatiet, kā pārlūkprogramma atveido tekstu ar piespiedu rindiņu pārtraukumiem. Kas notiek, ja logs tik ļoti saraujas, ka tajā neiederas pat viens vārds?

    Izveidojiet pats savu HTML dokumentu. Lai tas ir īss stāsts par sevi un saviem vaļaspriekiem.

Sveiki dārgie emuāra lasītāji! Mēs turpinām sadaļu "Vietnes izveide no nulles" un jo īpaši tagu tēmu ... Un šodien mēs apsvērsim tagus, kas atrodas jebkurā tīmekļa lapā - , un . Ir vēl viens tags, kuram vajadzētu būt katrā HTML dokumentā un par kuru es jau rakstīju vienā no iepriekšējiem rakstiem - tāpēc mēs to neaiztiksim.

Iepriekšējos slejas rakstos rakstīju par tukša faila izveidi html formātā. Faktiski tas tika izmantots pro rakstā (šajā vietā tika lietotas nosaukuma atzīmes). Tagad mēs tieši rediģēsim šo failu ar pilniem aprakstiem.

Un sāksim rakstu ar izveidotā faila rediģēšanu. Personīgi es to nosaucu par index.html, bet nosaukums var būt jebkas. Atveriet to ar jebkuru teksta redaktoru (labāk izmantot Notepad++, jo tajā ir koda izcelšana un citi noderīgi sīkrīki). Un nekavējoties pievienojiet tam atzīmes , un tieši tādā secībā, kādā tie ir uzrakstīti. Neaizmirstiet tos aizvērt, kā parādīts ekrānuzņēmumā. Dokuments izskatīsies šādi:

Tagad apsveriet katra taga nozīmi atsevišķi. Nav brīnums, ka tie ir ikvienā. HTML dokuments.

Tagu funkcijas

Tātad birka ir konteiners(). Tajā ir viss redzamais un neredzamais tīmekļa lapas saturs (ieskaitot tagus un ). Atvēršanas tags nāk uzreiz pēc Doctype deklarācijas un noslēguma atrodas dokumenta beigās. Tādējādi pārlūkprogrammai ir skaidrs, kur sākt dokumenta apstrādi un kur to beigt.

Teorētiski viņš pats var saprast, kas un kā. Galu galā ? Šis ir HTML valodas tulkotājs, un ir maz ticams, ka viņš sāks apstrādi no dokumenta vidus un pabeigs to pirms beigām. Jautājums, protams, ir apstrīdams, bet es vienmēr domāju (un tagad savu viedokli neatsaku), ka šī birka rakstīšana ir obligāta.

Pat ņemot vērā, ka šī taga funkcija ir tikai norobežojošs saturs, tam ir savi atribūti (kas tagad vai nu netiek izmantoti vispār, vai tiek izmantoti ārkārtīgi reti). Dažādi avoti norāda atribūtus, kas atšķiras viens no otra, tāpēc es neuzdrošinos izvirzīt pareizo versiju.

Vienīgais, ko varu droši teikt, ir tas, ka lielāko daļu atribūtu HTML 4.01 neatbalsta vai tie ir nevēlami. Es tomēr sniegšu vienu piemēru. - rīka padoms jebkurā dokumenta vietā. Piemēram, novietojot peles kursoru virs attēla, iespējams, tiks parādīts uznirstošais teksts. Arī šī taga gadījumā:

Tālāk ir norādīts, ko jūs redzēsit, virzot kursoru virs dokumenta ar šādu saturu:

Ir vēlams izmantot nosaukuma atribūtu, nevis tagā , bet jebkurā citā konkrētā lapas apgabalā. Pirmkārt, tas ir ērti, un, otrkārt, meklētājprogrammas labāk izturēsies pret jūsu vietni. Šis tags tieši neietekmē resursu optimizāciju. Mēs ejam tālāk.

Tag funkcija

Un nākamais rindā ir tagu . Tajā ir visa tehniskā informācija par lapu, kas palīdz pārlūkprogrammai un meklētājprogrammām. Tags ir konteinera tags un seko tūlīt pēc tam , tikai atšķirībā no pēdējās, beigu atzīmes neparādās dokumenta beigās, bet pirms sākuma taga .

Kādu informāciju var atrast ? Bet neviens. Viss šajā tagā ir pieejams tikai cilvēka acīm, skatot lapas avota kodu. Viss saturs šajā tagā ir paredzēts meklētājprogrammas un pārlūkprogrammas. Vienīgais, ko kaut kā var redzēt, ir birka , kas atbild par tīmekļa lapas loga nosaukumu. Šeit ir piemērs:</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>Teksts aiz ikonas ir atzīmes saturs <title>. Tagad apskatīsim saturu. <head>, ko mēs nevaram redzēt, bet kas ir ļoti svarīga daļa <b>vietnes izveide un popularizēšana.</b> Pirmkārt, šī ir līnija</p><p> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> </p><p>Šis ir metatags priekš <b>lapas satura veids</b>(Satura veids). Šajā gadījumā tas ir html kods UTF-8 kodējumā (content="text/html; charset=UTF-8"). Nākamais nāk virsraksta tags, kas aprakstīts iepriekš. Tad nāk rindas, kas sākas ar tagu <link>. Tas norāda saiti uz ārēju dokumentu. Piemēram, līnija</p><p> <link href="http://сайт/.../style.css" rel="stylesheet" media="screen" type="text/css" /> </p><p>norāda, ka ir pieslēgts (rel="stylesheet") fails ar (type="text/css"), kas atrodas tādā un tādā adresē (lai samazinātu rindas garumu, pusi adreses nomainīju ar punktiem) . Pēc šīs virknes apstrādes pārlūkprogrammā tā noteiks, kur iegūt <b>kaskādes stila lapas</b>.</p> <p>Kopumā head tagā ir daudz informācijas, par kuru var runāt bezgalīgi. Pēdējā lieta, ko vērts atzīmēt (īpaši gadījumā), ir apraksta tagu, atslēgvārdu un kanonisko tagu klātbūtne. ES izmantoju <b>spraudnis Viss vienā SEO pakotnē</b>, tāpēc tie atrodas iekšā <head>.</p> <p>Kā zināms, viss lielais vienmēr sākas ar mazumiņu. Ja jūs interesē atbilde uz jautājumu, kā izveidot vietni, izmantojot bloknotu, tad noteikti kaut kur esat dzirdējuši par šo iespēju. Tas tiešām ir iespējams. Bet uzreiz ir vērts pieminēt, ka, visticamāk, pašlaik neviens neizveidos modernu dinamisku interaktīvu vietni, izmantojot piezīmju grāmatiņu, jo tam ir īpašas programmas, kas ievērojami paātrina un vienkāršo izstrādes procesu. Bet ir pilnīgi iespējams izveidot pilnvērtīgu tīmekļa lapu.</p><b>Kā izveidot vietni notepad</b><br>Sākumā ir nepieciešams nedaudz iepazīties ar teoriju un vispārīgajiem terminiem. Lielākā daļa vietņu lapu ir parasti teksta dokumenti, kas veidoti īpašā veidā – hiperteksta iezīmēšanas valodā, saīsināti HTML. Daži HTML iezīmēšanu klasificē kā programmēšanas valodu, taču tā nav taisnība. <p>HTML ir tikai veids, kā standartizēt dokumentu iezīmēšanu, ko pārlūkprogrammas unikāli interpretē, lai to parādītu datora ekrānos lietotājam draudzīgā formā. HTML valodas galvenais rīks ir īpaši strukturālie elementi, ar kuru palīdzību tiek noformēts dokuments. Tos sauc par deskriptoriem vai tagiem.</p><p>Vispārīgi tags ir formas konstrukcija <table>Tātad tags sākas ar< после которого следует название тега table и вся конструкция завершается знаком >. Atzīmes ir pa pāriem, piemēram, padarot tekstu treknrakstā <b>un</b> un atvienots pārī kā jauna rinda <br>. Ja tiek izmantoti pārī savienoti tagi, tas ir jāizmanto kā sākuma tags <b>, un aizvēršana</b>. Noslēguma atzīme ir deskriptors ar slīpsvītru /.</p><p>Apsveriet galvenos tagu veidus un to mērķi.</p><ul><li><span><i>Elements <b><!DOCTYPE html> </b>. </i> Iestatīt pašā lapas sākumā un kalpo, lai norādītu pārlūkprogrammai, kā interpretēt šo dokumentu. Tas nav obligāts, bet ļoti vēlams lapā, lai izvairītos no iespējamām problēmām ar tā rādīšanu. <br></span></li><li><span><i>Tag <b><html> </b>. </i> Tas ir pāra tags un sastāv no divām daļām <html>un</html>. Katra vietnes lapa sākas ar šo tagu un beidzas ar to. <br></span></li><li><span><i>Tag <b><head> </b>. </i> Tas ir arī pāra tags un sastāv no divām daļām <head>un</head>. Šis tags satur dažādu svarīgu informāciju par lapu: tās nosaukumu, saites uz izmantotajiem dizaina stiliem, iekļautos skriptus, īpašus metadatus. <br></span></li><li><span><i>Tag <b><title> </b>. </i> <title>un un atrodas tagā . Šis tags nosaka tās lapas nosaukumu, ar kuru tas būs redzams pārlūkprogrammā.

  • Tag . Tā ir pāra birka, kas sastāv no divām daļām un un seko tagam Lapā. Tas atrodas tagā <body>, kas satur visu informāciju, kas tiek rādīta pārlūkprogrammas lapā.
  • Tag . Ir vientuļš. Izmanto, lai norādītu rindiņas pārtraukumu dokumentā.
  • Tag . Attiecas uz pārī savienotiem tagiem, ir rakstīts nedaudz atšķirīgā formā no citiem tagiem un tiek izmantots saišu izveidošanai. Tas ir būtisks elements visā HTML valodas koncepcijā, kā arī internetā kopumā.
  • Tag

    . Attiecas uz pārī savienotiem tagiem un sastāv no divām daļām. Ar tās palīdzību tiek sastādīta teksta rindkopa.

  • tagus

    ,

    ,

    ,

    ,
    ,
    . Tie pieder pārī savienotiem tagiem, jo ​​tie, piemēram, sastāv no diviem tagiem

    un

    . Šie tagi kalpo, lai izveidotu sešus apakšvirsrakstu līmeņus un vienlaikus parāda tajos ietvertā teksta nozīmi attiecībā pret visu dokumentu.

  • Tag . Tas ir arī pārī savienots tags, kas sastāv no divām daļām un un iestata fonta stilu uz treknrakstu.
  • Kopumā ir aptuveni simts tagu, taču ar desmit izskatītajiem jau ir pietiekami, lai piezīmju grāmatiņā noformētu vietnes vienkāršāko lapu. Pamatdokumentu atzīmes , , , <body>izplatīts stingrā secībā. Birkas iekšpusē <body>pārējie deskriptori var būt dažādās secībās HTML valodas standartu ietvaros. Vienkāršākais veids, kā to saprast, ir izveidot vienkāršu tīmekļa lapu. <ol><li><span>Palaidiet Notepad un iestatiet elementu tās pirmajā rindā<!DOCTYPE html>, kas norāda pārlūkprogrammai, kā interpretēt jūsu dokumentu. <p> <!DOCTYPE html></p></span></li><li><span>Izveidojiet jaunu rindiņu un pievienojiet pāra tagu <html>. Tulko noslēguma tagu</html> divas rindas uz leju. <p> <!DOCTYPE html><br><html></p></span></li><li><span>Pievienojiet pāra tagu <head>rindā starp tagiem <html>un iztulkot noslēguma tagu</head> divas rindas uz leju. <p> <!DOCTYPE html><br><html><br><head></p><p></head><br></html></p></span></li><li><span>Līnijā starp tagiem <head>un</head> uzrakstiet pāra tagu <title> vienā rindā.






  • Ievadiet savas tīmekļa lapas nosaukumu starp tagiem un. Piemēram, šādi.




    Mana pirmā mājas lapas lapa

  • Novietojiet kursoru uz līnijas pēc beigu atzīmes un veiciet rindas padevi. Parādītajā tukšajā rindā ievadiet pāra tagu .




    Mana pirmā mājas lapas lapa


  • Veiciet dubultu tulkojumu starp iekšējiem tagiem un. Parādītajā rindā ievadiet pārī savienoto nosaukuma tagu

    . Ierakstiet tagā

    lapas apakšvirsraksts.




    Mana pirmā mājas lapas lapa


    Par mani



  • Pēc noslēdzošās virsraksta atzīmesveiciet rindiņas pārtraukumu un iestatiet pārī rindkopas tagus jaunajā rindā. Ievietojiet tekstu starp tiem. Piemēram, jā.




    Mana pirmā mājas lapas lapa


    Par mani


    Mani sauc Ivanovs Ivans. Es veidoju savu vietni.



  • Iekļaujiet vārdu un uzvārdu pāra tagā lai tie būtu drosmīgi.




    Mana pirmā mājas lapas lapa


    Par mani


    Mani sauc Ivanovs Ivans. Es veidoju savu vietni.



  • Pēc rindkopas taga aizvēršanas

    veiciet rindas padevi un ievadiet pāra tagu jaunajā rindā

    . Ievadiet tekstu starp tagiem.




    Mana pirmā mājas lapas lapa


    Par mani


    Mani sauc Ivanovs Ivans. Es veidoju savu vietni.


    Mans progress



  • Pēc beigu subtitru atzīmesvēlreiz veiciet rindiņas pārtraukumu, ievadiet pāra rindkopas tagu un ierakstiet starp šiem tagiem patvaļīgu tekstu.




    Mana pirmā mājas lapas lapa


    Par mani


    Mani sauc Ivanovs Ivans. Es veidoju savu vietni.


    Mans progress




  • No rakstā uzskaitītajiem tagiem neizpētīti palika divi – rindu plūsma
    un vissvarīgākais saišu veidošanas tags
    . Pielietosim tos. Pirms pēdējās beigu atzīmes ievadiet deskriptoru
    , un starp
    un

    tipa konstrukcija. Jums vajadzētu iegūt sekojošo.




    Mana pirmā mājas lapas lapa


    Par mani


    Mani sauc Ivanovs Ivans. Es veidoju savu vietni.


    Mans progress


    Ir apgūta HTML pamata sintakse un izveidota topošās vietnes pirmā lapa.
    Apmācību procesā tika izmantoti vietnes materiāli



  • Starp pēdiņām tagā ievadiet tās lapas adresi, uz kuru izveidosiet saiti. Pirms atzīmes varat ievadīt vārdu Saite un starp tagiem un ievadiet tekstu, kas tiks parādīts lapā.




    Mana pirmā mājas lapas lapa


    Par mani


    Mani sauc Ivanovs Ivans. Es veidoju savu vietni.


    Mans progress


    Ir apgūta HTML pamata sintakse un izveidota topošās vietnes pirmā lapa.
    Apmācību procesā tika izmantoti vietnes materiāli

    Saite: vietne



  • Ar to var pabeigt vietnes vienkāršākās lapas izveidi. Principā to varēja pabeigt arī 9. solī, bet, ja nopietni domājat apgūt HTML valodu, tad papildus prakse nebūs lieka. Saglabājiet lapu ar *.html paplašinājumu un varat to atvērt jebkurā pārlūkprogrammā, lai skatītu sava darba rezultātus. Ja viss ir izdarīts pareizi, jums vajadzētu redzēt kaut ko līdzīgu šim.
  • Ja pēc šī raksta izlasīšanas jūsu apņēmība izveidot vietni nav izsīkusi, noteikti iepazīstieties ar pilnu HTML valodas sintaksi, kā arī uzziniet, kā lapas dizainā izmantot CSS kaskādes stilus.

    Tīmekļa vietņu izstrāde, izmantojot HTML hiperteksta iezīmēšanas valodu

    8. klase

    1. nodarbība Web lapas struktūra.

    Vietnes koncepcija

    Informācija globālajā tīmeklī
    glabājas tīmekļa vietņu veidā.
    Tīmekļa vietne pēc struktūras ir līdzīga
    žurnāls par tēmu vai
    problēma. Kā tiek veidots žurnāls
    drukātās lapas, un Web vieta sastāv
    no datora tīmekļa lapām.
    Web lapas ir saistītas ar hipersaitēm.

    Vietņu veidi

    ierēdnis (valdība,
    Dome, skola...)
    Komerciāls
    Personīga

    Tīmekļa lapu priekšrocības:

    Neliels informācijas apjoms
    ("plaušas")
    Piemērots apskatei dažādos
    OS.
    Dinamisks.
    Interaktīvs.

    Vietnes izveides soļi:

    1.
    2.
    3.
    Vietnes izveide lokāli
    dators.
    pārbaudi (pārbaudi
    pareiza darbība).
    Publicēt tiešsaistē -
    izvēlieties hostinga serveri
    (maksas vai bezmaksas).

    Programmas vietnes izveidei:

    1) vienkāršākais teksta redaktors (bez
    teksta formatējums):
    Piezīmju grāmatiņa
    2) pārlūkprogramma, lai skatītu lapas:
    Internet Explorer
    3) Attēlu apstrādes programma:
    fotošops

    Vizuālie tīmekļa redaktori

    Vietnes izveide HTML valodā ir ļoti svarīga
    darbietilpīgs, īpašs
    zināšanas.
    Ir vizuālie tīmekļa redaktori
    (programmas) vietņu izveidei.
    Darbs pēc WYSIWYG principa
    (tas ir tas, ko jūs redzat).

    Web lapas struktūra

    10. Birkas

    Web lapas izskatu nosaka administratori
    komandas - tagi, kas ir
    leņķa kronšteini< >
    Tagi var būt atsevišķi (neatkārtoti) vai
    pārī (konteineri): pirms aizvēršanas
    konteinera tags ir rakstīts ar slīpsvītru (/)

    Birkas ir rakstītas ar angļu burtiem (lielie burti,
    mazie burti).

    11. Web lapas struktūra

    Viss lapas HTML kods
    ievietots galvenajā iekšpusē
    konteiners:
    .
    Tīmekļa lapa ir sadalīta
    2 loģiskās daļas:
    virsraksts (HEAD)
    saturs (BODY).

    12. Web lapas nosaukums

    Tīmekļa lapas nosaukums ir iesaiņots konteinerā.
    Satur dokumenta nosaukumu un palīdzības informāciju par lapu
    (piemēram, kodējuma veids), ko pārlūkprogramma izmanto
    pareizs displejs.
    Tīmekļa lapas nosaukums ir ietverts konteinerā<ТITLE> un
    skatīšanas laikā tiek parādīts pārlūkprogrammas loga augšējā rindā
    lapas.

    <ТITLЕ>Dators

    13. Web lapas veidnes rakstīšana



    <ТITLЕ>Dators

    14. Mājas lapas galvenais saturs

    Lapas galvenais saturs ir ievietots
    konteiners .
    Var saturēt: tekstu, tabulas, darbību
    virknes, attēli, saites, skaņas faili...
    Ieliksim lapā tekstu "Viss par datoru":
    Viss par datoru

    15. Web lapas veidne



    <ТITLЕ>Dators


    Viss par datoru

    16.

    17. Kā saglabāt Web lapu

    1. Vietnei izveidojiet īpašu mapi un
    saglabājiet visus vietnes failus šajā mapē.
    2. Saglabājiet Web lapu kā failu ar
    ar nosaukumu index.html ir titullapa
    vietne (pirmoreiz ielādēta pārlūkprogrammā)
    Web lapu failu paplašinājumi — .htm
    vai.html

    18. Mēs veidojam savu vietni….

    Ir nepieciešams atšķirt index.html faila nosaukumu - zem
    kas Web lapa tiek saglabāta failā
    sistēma un Web lapas faktiskais nosaukums
    "Dators" - tiek parādīts augšējā rindā
    pārlūkprogrammas logi un vispirms parsēti
    meklētājprogrammas.
    Tīmekļa lapas nosaukumam jābūt maksimālajam
    atbilstības pakāpe tās saturam.
    1. Ievadiet Web lapas HTML kodu programmā Notepad.
    2. Saglabājiet failu kā index.html mapē
    vietne. Izvēlieties faila tipu - "Visi faili".
    3. Skatīšanai atveriet šo failu pārlūkprogrammā.

    19.

    20. NODARBĪBA #2

    21. 2. nodarbība. Teksta formatēšana tīmekļa lapā

    22. Teksta formatēšana

    Kamēr lapa nav pārāk pievilcīga: mazs drukāts un melns teksts
    balts fons. Bet ar tagu palīdzību jūs varat izrotāt tekstu.
    1. Virsraksti: tagi no<Н1>(lielākais) līdz<Н6>(mazākais).
    <Н1>Viss par datoru
    2. Fonts (FONT). Dažiem tagiem ir atribūti – rekvizītu nosaukumi, var
    uzņemties noteiktas vērtības.
    FONT face="Arial" — fonta seja
    izmērs = 4
    - izmērs
    color="red" - krāsa
    3. Izlīdzināšana (ALIGN). Teksts parasti ir līdzināts pa kreisi
    lapā, taču ir pieņemts virsrakstu novietot centrā.
    ALIGN="pa kreisi",
    ALIGN="pa labi",
    <Н1 ALIGN="center">Viss par datoru
    ALIGN="centrs"

    23.Fonta krāsa

    Atribūta COLOR vērtību var iestatīt divos veidos:
    a) krāsas nosaukums (piemēram, "sarkans", "zaļš", "zils" un tā tālāk),
    b) tā RGB heksadecimālā vērtība "#RRGGBB", kur
    pirmie divi heksadecimālie cipari nosaka intensitāti
    sarkans (sarkans), nākamie divi ir zaļā (zaļā) intensitāte un
    pēdējie divi ir zilo (zilo) krāsu intensitāte.
    Minimālā krāsas intensitāte ir norādīta heksadecimāldaļās
    skaitlis 00, un maksimums ir FF. Zila krāsa = "#0000FF".
    Tādējādi jūs varat iestatīt virsraksta zilo krāsu ar FONT tagu ar
    COLOR atribūts:
    <Н1 ALIGN="center">Viss par datoru

    24.

    25. Teksta formatēšana

    4. Horizontālā līnija atdalīsies
    virsraksts no pārējā satura
    lapas ar vienu tagu

    .
    5. Punkti:<Р>. Skatoties iekšā
    rindkopas pārlūkprogrammā ir atdalītas viena no otras
    citi intervāli. Par katru rindkopu
    varat iestatīt noteiktu veidu
    izlīdzināšana.

    26. Praktiskais darbs 3.8 Mācību vieta "Dators"

    Formatējiet sākotnējo tekstu
    lapas:
    1) Izveidojiet un izlīdziniet 2 rindkopas (3. uzdevums)
    2) Iezīmējiet lapas nosaukumu ar krāsu un
    atdaliet to ar horizontālu joslu
    (4. uzdevums)

    27.

    28. 3. NODARBĪBA

    29. 3. nodarbība: attēlu ievietošana tīmekļa lapās

    30. Ievietojiet attēlus

    Tīmekļa lapās var būt 3 formātu grafiskie faili -
    GIF, JPG un PNG. Ja attēls ir saglabāts citā formātā, tad
    vispirms ir jāpārveido uz kādu no šiem
    formātos.
    Tagu izmanto attēla ievietošanai. ar atribūtu
    SRC, kas norāda, kur fails tiek glabāts
    lokālajā datorā vai internetā.
    1) attēls vietējā datorā mapē ar vietni:

    2) attēls atrodas citā lokālā datora mapē:

    3) attēls atrodas attālā serverī internetā:

    31. Paskaidrojuma teksts. Figūras atrašanās vieta tekstā.

    Ilustrācijas tīmekļa lapās ir kļuvušas būtiskas
    dizaina elements. Tomēr lietotāji, lai
    ietaupiet laiku, dažreiz atspējojiet pārlūkprogrammas lejupielādes
    grafiskos attēlus un tikai lasāmus tekstus.
    Tāpēc, lai nezaudētu lapas nozīmi, nevis zīmē
    paskaidrojošais teksts ir jāparāda ar ALT atribūtu

    Figūras pozīcija tekstā - nosaka atribūtu ALIGN
    tagu : TORS, VIDĒJAIS, APAKŠĒJĀ, KREISĀ, LABĀ.
    ALIGN="pa labi">

    32. Gatavās vietas skats

    33. Vietnes lapas kods


    Dators


    Viss par datoru





    Šajā vietnē jūs varat iegūt dažādu informāciju par
    dators, tā programmatūra un datoru cenas
    Piederumi.


    Terminu vārdnīca iepazīstinās jūs ar datoru
    noteikumiem, kā arī varat aizpildīt anketu.



    34. 4. nodarbība

    35. Pārbaudes darbs Nr.3

    1.
    2.
    3.
    4.
    5.
    6.
    7.
    8.
    9.
    10.
    Kas ir tīmekļa vietne?
    Vietņu veidi.
    Kā tīmekļa lapas tiek apvienotas vietnēs?
    Kas ir tagi? tagu konteiners? Uzrakstiet galveno konteineru
    tīmekļa lapas.
    Kāda ir tīmekļa lapas loģiskā struktūra?
    Norādiet 5 lappušu formatēšanas tagus.
    Kas ir taga atribūts?
    Kādi ir veidi, kā iestatīt krāsas tīmekļa lapā?
    Kādi tagi tiek izmantoti, lai ievadītu nosaukumu? Formatēšana
    fonts? Ievadot rindkopu?
    Kāds tags un tā atribūti tiek izmantoti attēlu ievietošanai?

    36. 4. nodarbība. Hipersaites Web lapās

    37.

    Hipersaites ļauj lejupielādēt
    ar pārlūkprogrammu saistītas citas tīmekļa lapas
    no iepriekšējās.
    Hipersaite sastāv no 2 daļām: adreses
    un atsauces rādītājs.
    Hipersaite ir iestatīta uz universālu
    tagu ar atribūtu HREF (viņš
    norāda, kurš fails tiek saglabāts
    vēlamā tīmekļa lapa):
    saites rādītājs

    38. Hipersaišu veidi

    1) iekšējais:
    Rādītājs
    saites

    2) ārējais:
    filename.html"> Saites rādītājs

    39. Hipersaišu norādes

    Rādītājs - redzamā daļa
    hipersaites: teksts vai attēls

    40. Hipersaišu adreses daļa

    Dodieties uz citām tīmekļa lapām:
    saites rādītājs
    Atvērt attēlu pārlūkprogrammā:
    Bilde
    Klausieties skaņu (palaižot iebūvēto pārlūkprogrammu
    spēlētājs):
    Skaņa
    Saglabāt failu (palaiž iebūvēto pārlūkprogrammu
    failu lejupielādes pārvaldnieks):
    Lejupielādēt failu

    41. E-pasta hipersaite

    Šis hipersaites veids ir
    īpašs konteiners


    ">Mūsu e-pasts

    42. Gatavās vietnes lapas skats

    43. Vietnes lapas kods


    Dators


    Viss par datoru





    Šajā vietnē jūs varat iegūt dažādu informāciju par datoru, tā programmatūru
    datoru komponentu nodrošinājums un cenas.


    Terminoloģiskā vārdnīca jūs iepazīstinās ar datoru terminiem, kā arī jūs
    jūs varat aizpildīt veidlapu.


    [Programmas]  
    [Vārdnīca]  
    [Piederumi] 
    [Aptauja]



    ">E-pasts:


    44. 5. nodarbība

    45. 5. nodarbība. Tīmekļa lapu saraksti

    46. ​​Sarakstu veidi

    Numurēts
    Apzīmēts
    Terminu saraksti (kā vārdnīcā)
    Ligzdotie saraksti

    47.Numurētais saraksts

    Saraksts - konteinerā
    Saraksta vienums - tags

  • Atribūts TYPE ir numerācijas veids (arābu val
    skaitļi; Es - Romāns; a - latīņu valoda
    mazie burti)

    1. Sistēmas programmas
    2. Lietojumprogrammas
    3. Programmēšanas sistēmas

    48. Saraksts ar aizzīmēm

    Saraksts - konteinerā
    Saraksta vienums - tags

  • Atribūts TYPE ir marķieru veids (“disks” ir disks,
    "kvadrāts" - kvadrāts, "aplis" - aplis)

    • Teksta redaktori
    • Grafiskais redaktors
    • Izklājlapas
    • Datu bāzes pārvaldības sistēmas

    49. Terminu saraksts

    Saraksts - konteinerā

    Saraksta vienums - tags

    Vispirms tiek uzrakstīts termins, pēc tam
    tā definīcija (kā vārdnīcā)

    50. 6. nodarbība

    51. 6. nodarbība. Interaktīvās veidlapas tīmekļa lapās

    52. Interaktīvās formas jēdziens

    Lai sazinātos ar vietnes apmeklētājiem
    veidotāji tīmekļa lapā
    interaktīvās formas.
    Veidlapas satur dažādus elementus
    vadīklas:
    teksta lauki
    nolaižamie saraksti
    karogi
    slēdži...

    53.Teksta lauks

    galvenais konteiners

    Teksta lauks - teksta ievadīšanai no tastatūras: tags
    ar atribūtiem:
    TYPE="teksts" — satura veids (teksts)
    NAME="____" — lauka nosaukums
    SIZE="40" — ievades lauka garums (rakstzīmēs)

    - līniju atdalītājs (pārvietojiet kursoru uz jaunu
    virkne)

    54. Slēdži (radio pogas)

    Apaļa poga, lai izvēlētos vienu no vairākiem
    atbilžu varianti:
    TYPE="radio"
    Visiem šīs grupas dalībniekiem ir jābūt
    tāds pats nosaukums: NAME="grupa"
    Atribūtos VALUE ir izvēles iespējas
    atbildes: VALUE="students"

    55.Karogi

    Kvadrātveida lodziņš vairāku atbilžu atlasei no
    ieteiktās iespējas:
    TYPE = "izvēles rūtiņa"
    Katram šīs grupas elementam ir jābūt savam nosaukumam:
    NAME = "box1", NAME = "kaste2",
    …..
    VALUE atribūti ietver atbilžu izvēles iespējas:
    VALUE = "WWW", VALUE = "e-pasts", ….
    Katrai VĒRTĪBAi ir sava atbilde.
    www

    56.Saraksta lodziņi

    Lai izveidotu nolaižamo sarakstu
    izmantojiet konteineru

    Tajā katrs saraksta elements
    dots ar birku