HTML gairės
description
Transcript of HTML gairės
![Page 1: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/1.jpg)
HTML gairėsHTML gairės
IT mokytojaIT mokytojaVilma BernotienėVilma Bernotienė
![Page 2: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/2.jpg)
TurinysTurinysSąvokos.Bendrosios tinklalapio gairės.– Klausimai.– Užduotys.
Antraštė. Lygiuotė. Šrifto stilius.– Klausimai.– Užduotys.
![Page 3: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/3.jpg)
Hipertekstiniuose dokumentuose informacija pateikiama hipertekstu (ang. Hipertext).
Hipertekstui rašyti naudojama speciali kalba HTML (ang. Hyper Text Markup Language) arba jos modifikacija.
![Page 4: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/4.jpg)
Pagrindinis HTML kalbos vienetas yra elementaselementas.
HTML elementas turi vardąvardą ir gali turėti bet kokį skaičių atributųatributų. Elemento viduje gali būti tekstas bei kiti elementai. Tiek tekstas, tiek ir dukteriniai elementai paprastai gali kartotis ir sekti bet kuria tvarka.
GairėmisGairėmis (angl. tags) nurodomas kiekvienas tinklalapio elementas.
Gairės rašomos tarp kampinių skliaustų (< < >>). Daugumai gairių reikia nurodyti jų galiojimo ribas, užrašant gaires su dešiniu brūkšniu (</ ></ >).
![Page 5: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/5.jpg)
Bendrosios tinklalapio Bendrosios tinklalapio gairėsgairės
<html>...</html>
Informuoja naršyklę, kad dokumentas parašytas naudojant HTML kalbos gaires.
<head>...</head>
Čia rašoma informacija apie patį tinklalapį: pavadinimas, ženklų koduotė, tinklalapio autoriaus vardas, raktažodžiai, bendras aprašymas skirtas paieškos sistemoms, taip pat šioje vietoje yra įtraukiami javascript, css ir kiti failai. Head dalies nesimato naršyklėje, nebent pažiūrėjus tinklalapio kodą (source).
<body>...</body>
Čia pateikiama tai, kas, kur ir kaip turi būti rodoma naršyklės lange ( tentelės, paveikslai ir pan.).
![Page 6: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/6.jpg)
![Page 7: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/7.jpg)
<title>...</title>
Nurodomas tinklalapio pavadinimas, matomas naršyklės atraštės juostoje.
<meta> Tai pavienė gairė, t.y. jai nereikia nurodyti galiojimo ribų.Šia gaire nurodoma raktažodžiai, bendras aprašymas skirtas paieškos sistemoms, taip pat šioje vietoje yra įtraukiami javascript, css ir kiti failai.
<!- -
- ->
Tarp šių ženklų yra rašomi komentarai, kurie padeda skaityti HTML kalba parašytą tekstą, bet neturibtys įtakos tinklalapio vaizdavimui.
![Page 8: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/8.jpg)
<br >(angl. Break)
Nurodo puslapio eilutės lūžio vietą. pirma eilutė<br > antra eilutė<br> trečia eilutė<br ><br ><br > ketvirta eilutė, prieš tai 2 tuščios
<hr>(angl. Horizontal Rule)
Nurodo horizontalią liniją, kuria galima atskirti pastraipas, logines dalis.<p>Pirmas paragrafas</p><hr ><p>Antras paragrafas</p>
![Page 9: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/9.jpg)
 (angl. NoBreak Space)
Jungiamasis tarpas (žodžiai nebus skiriami į skirtingas eilutes).Formatavimas Teksto stilius Jungiamasis tarpas
<nobr></nobr>(angl. NoBreak )
![Page 10: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/10.jpg)
KlausimaiKlausimai
![Page 11: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/11.jpg)
UžduotysUžduotys
![Page 12: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/12.jpg)
![Page 13: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/13.jpg)
Antraštė. Lygiuotė. Šrifto Antraštė. Lygiuotė. Šrifto stilius.stilius.
Antraštė — žodis, žodžių junginys, nurodantis žemiau pateikiamo teksto esmę. Antraštė rašoma atskiroje pastraipoje, paryškinant šriftą, keičiant šrifto dydžį, stilių.
Tinklalapyje antraštėms ir pavadinimams rašyti naudojamos gairės: <h1>, <h2>, <h3>, <h4>, <h5> ir <h6>.
Pavadinimas, nurodomas viena šių gairių, daugelio paieškos sistemų laikomas reikšminių žodžių. Tekstas pažymėtas šiomis gairėmis, naršyklėje atvaizduojamas tam tikro dydžio pusjuodžiu šrifto stiliumi, be to, prieš tekstą ir po juo paliekamas tarpas.
![Page 14: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/14.jpg)
![Page 15: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/15.jpg)
Skyrius — teksto dalis, kuriai taikoma ta pati lygiuotė.Skyrius išskirimas gairėmis <div> ... </div>.Kiekvianam tokiam skyriui atributu Align galima
nurodyti skirtingas lygiuotes. Atributą sudaro vardas ir reikšmė. Atributo vardas nurodo keičiamą savybę.
Pvz.: Gairė Atributo
vardasAtributo reikšmė
<div> align left
<div align=“left”>
![Page 16: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/16.jpg)
PASTABA: uždaromojoje gairėje atributas su reikšme nekartojamas.
![Page 17: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/17.jpg)
![Page 18: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/18.jpg)
![Page 19: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/19.jpg)
KlausimaiKlausimai1. Kaip tinklapyje nurodomos antraštės?2. Ką naršyklei nurodo gairė <h1>?3. Kuria gaire nurodyto pavadinimo rašmenys bus
didesni: <h2> ar <h6>?4. Kakia yra gairių <b> ir <i> paskirtis?5. Kokia gairės <div> paskirtis?6. Kaip nurodomas gairės atributas ir jo reikšmė?7. Kaip tinklalapyje išdėstyti tekstą centre,
sulygiuoti pagal kairįjį kraštą, pagal dešinįjį kraštą ir pagal abu kraštus?
![Page 20: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/20.jpg)
UžduotysUžduotys
![Page 21: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/21.jpg)
![Page 22: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/22.jpg)
![Page 23: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/23.jpg)
![Page 24: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/24.jpg)
Sukurkite tinklalapį Matematika.html sutvarkykite jame tekstą pagal pateikiamą pavyzdį.
![Page 25: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/25.jpg)
Sukurkite tinklalapį Chemija.html sutvarkykite jame tekstą pagal pateikiamą pavyzdį.
![Page 26: HTML gairės](https://reader034.fdocuments.net/reader034/viewer/2022042516/5681416d550346895dad528d/html5/thumbnails/26.jpg)
Sukurkite tinklalapį Mintys.html sutvarkykite jame tekstą pagal pateikiamą pavyzdį.Pasinaudokit jungiamuoju tarpu įžymių žmonių vardams ir pavardėms nurodyti