HTML (Hyper Text Markup Language – ჰიპერტექსტური ინფორმაციის განლაგების ენა) არის ვებ გვერდების შესაქმნელი ენა. უშეცდომოდ ფორმატირებულ HTML დოკუმენტს ასევე ვებ გვერდს უწოდებენ.
HTML შექმნა ბრიტანელმა მეცნიერმა ტიმ ბერნს-ლი-მ დაახლოებით 1986-1991 წლებში. ამ ენის მართვას ახორციელებს W3C მსოფლიო ქსელის კონსორციუმი (w3c.org ხელმძღვანელია სერ ტიმოთი ჯონ ბერნს-ლი) და WHATWG (Web Hypertext Application Technology Working Group).
ამ ვიდეოგაკვეთილებში ვეცდები განახოთ HTML ენის სემანატიკა და განვმარტო ტეგების გამოყენება რაც საკმარისი იქნება მარტივი ვებ გვერდის შესაქმნელად
ტექსტის გამუქება დახრა და გახაზვა
tegi მნიშვნელობა
პარაგრაფი
სათაურები
მოგესალმებით
ამ ვიდეოგაკვეთილში თქვენ ნახავთ ტექსტის ფრაგმენტის გამუქებას, დახრას და გახაზვას.
იმისთვის, რომ გაიაზროთ რისი გაკეთება გვინდა, ნახეთ საბოლოო პროდუქტი: უნდა შევქმნათ ვებ გვერდის კოდი, რომლის შესრულების შემდეგ ბრაუზერი გამოიტანს ტექსტს, რომლის ერთი ნაწილი არის გამუქებული, შემდეგი ნაწილი დახრილი, ხოლო კიდევ ერთი ნაწილი უნდა იყოს გახაზული.
ტექსტის ეს თვისებები გამოიყენება ვებ გვერდის გარკვეულ ნაწილზე ყურადღების გასამახვილებლად. ამ ტეგების საშუალებით შესაძლებელია ტექსტიდან გამოიყოს მნიშვნელოვანი ნაწილი. ტექსტის გარკვეულ ნაწილზე აქცენტის გასამახვილებლად საკმარისია ერთი რომელიმე ფუნქციის გამოყენება.
მაშ ასე ვნახოთ სამივე ტეგი ცალ-ცალკე.
მე უკვე გახსნილი მაქვს Notepad++, სადაც თქვენ ხედავთ ბოლო ნამუშევარ დოკუმენტს. სანამ ამ დოკუმენტში ცვლილებებს შეიტანდეთ, File-> Save As ღილაკის დამხმარებით შეინახეთ მეორე გაკვეთილის საქაღალდეში. ფაილს სახელად დაარქვით bold. მოქმედება დაასრულეტ ღილაკით შენახვა.
კომენტარებში ტექსტი შევცვალოთ „ტექსტის გამუქება, დახრა და გახაზვა“
Title ტეგის დახმარებით ვებ გვერდის სათაური შევცვალოთ ტექსტით „ტექსტის გამუქება, დახრა და გახაზვა“.
ასევე იგივე ტექსტი ჩავწეროთ h1 ტეგებს შორის. შეიძლება იფიქროთ ამდენჯერ რაღა საჭიროა ერთიდაიგივე ტექსტის ჩაწერაო, მაგრამ თუ დააკვირდებით, მიხვდებით, რომ პირველ შემთხვევაში კომენტარის ტექსტი ბრაუზერში არ გამოისახება, მეორე ტექსტი იქნება ვებგვერდის სათაური, ხოლო მესამე ტექსტი გამოვა უკვე ვებგვერდის ასე ვთქვათ კონტენტში (შემადგენლობაში)
მოდით დავრწმუნდეთ რა მივიღეთ. დაიმახსოვრეთ შეტანილი ცვლილებები და დააჭირეთ ბრძანებას Run->launch in chrome.
მართალც ყველაფერი თავის ადგილზეა
ახლა კი პარაგრაფის ტეგებში არსებული ტექსტი შეცვალეთ შემდეგი ტექსტით
„ეს არის ჩვეულებრივი ტექსტი.“ აკრიფეთ გამხსნელი და დამხურავი ტეგი b, (ბი), კურსორი დააბრუნეთ ტეგის შიგნით და აკრიფეთ ტეგის შიგთავსი
ეს კი არის მუქი ტექსტი
პარაგრაფის მთლიანი ტეგი მონიშნეთ, დაიმახსოვრეთ ასლი და ჩასვით ერთი სტრიქონის გამოტოვებით.
პარაგრაფის შიგნით არსებული გამხნელი და დამხურავი ტეგი b შეცვალეთ გამხსნელი და დამხურავი ტეგით i. წინადადება „ეს არის მუქი ტექსტი“ შეცვალეთ კონტექსტის შესაბამისად, ანუ „ეს ტექსტი დახრილია“.
ახლა კი მინდა თავიდან შეგახსენოთ კოდის აკრეფის რჩევები:
კოდში გამოტოვეთ ცარიელი სტრიქონი და აკრიფეთ პარაგრაფის გამხსნელი და დამხურავი ტეგები ჰაერის გარეშე. კურსორი ჩასვით ტეგების შიგნით და აკრიფეთ შემდეგი ტექსტი
„ეს არის ჩვეულებრივი ტექსტი.“ აკრიფეთ გამხსნელი და დამხურავი ტეგი u. კურსორი გადაიყვანეთ ტეგის შიგნით და აკრიფეთ შემდეგი ტექსტი: „ეს ტექსტი გახაზულია“. კურსორი გადაიყვანეთ დამხურავი u ტეგის გარეთ და აკრიფეთ შემდგი ტექსტი. ეს ტექსტი კვლავ ჩვეულებრივია“.
ახლა კი დროა გადახედოთ შეტანილ ცვლილებებს, ნახოთ სადმე ხომ არა არის დაშვებული შეცდომები, ჩაასწოროთ ისინი და შემეგ დაიმახსოვროთ შეტანილი ცვლი ლებები. (კვლავ გთხოვთ, არ გამოგრჩეთ ეს მნიშვნელოვანი ეტაპი).
ბრაუზერში ნახეთ რა მიიღეთ. თუ ყველაფერი სწორად გააკეთეთ თქვენს ეკრანზეც ანალოგიური გამოსახულება უნდა იყოს.
მმართლაც თქვენ ეკრანზე ხედავთ გამუქებულ ტესტს, დახრილ ტექსტ და ტექსტს რომელიც არის გახაზული.
ტექსტი სხვა თვისებები, (მაგალითად, ფერი ან ზომა), HTML 5 ვერსიაში მხარდაჭერილი არ არის და მიეთითება CSS სტილების დახმარებით. ამიტომ ამ თვისებებს ამ თემაში არ განვიხილავთ.
მაშ ასე.
იმისთვის რომ ვებგვერდზე აქცენტი გაამახვილოთ ტექსტის გარკვეულ ნაწილზე, შეგიძლიათ გამოიყებოთ ტექსტის ფრაგმენტის გამუქება, დახრა ან გახაზვა. შესაბამის ტეგები შემდეგნაირად გამოიყურება
— ტექსტის ფრაგმენტის გასამუქებლად
— ტექსტის ფრაგმენტის დასახრელად
— ტექსტის ფრაგმენტის გასახაზად
გმადლობთ ყურადრებისთვის!