HTML 5
თავი 1. შესავალი
00:03:34
00:04:34
00:09:04
თავი 2. ტექსტთან მუშაობა
00:05:34
00:02:33
00:05:30
00:05:23
თავი 3. სიები
00:08:23
00:07:53
00:06:19
00:04:35
თავი 4. ცხრილთან მუშაობა
00:10:09
00:08:53
თავი 5. სურათთან მუშაობა
00:12:41
00:11:07
თავი 6. ბმულები
00:11:27
00:07:11
00:04:00
თავი 1. შესავალი
00:03:34
00:04:34
00:09:04
თავი 2. ტექსტთან მუშაობა
00:05:34
00:02:33
00:05:30
00:05:23
თავი 3. სიები
00:08:23
00:07:53
00:06:19
00:04:35
თავი 4. ცხრილთან მუშაობა
00:10:09
00:08:53
თავი 5. სურათთან მუშაობა
00:12:41
00:11:07
თავი 6. ბმულები
00:11:27
00:07:11
00:04:00
HTML (Hyper Text Markup Language – ჰიპერტექსტური ინფორმაციის განლაგების ენა) არის ვებ გვერდების შესაქმნელი ენა. უშეცდომოდ ფორმატირებულ HTML დოკუმენტს ასევე ვებ გვერდს უწოდებენ.
HTML შექმნა ბრიტანელმა მეცნიერმა ტიმ ბერნს-ლი-მ დაახლოებით 1986-1991 წლებში. ამ ენის მართვას ახორციელებს W3C მსოფლიო ქსელის კონსორციუმი (w3c.org ხელმძღვანელია სერ ტიმოთი ჯონ ბერნს-ლი) და WHATWG (Web Hypertext Application Technology Working Group).
ამ ვიდეოგაკვეთილებში ვეცდები განახოთ HTML ენის სემანატიკა და განვმარტო ტეგების გამოყენება რაც საკმარისი იქნება მარტივი ვებ გვერდის შესაქმნელად
მოგესალმებით!
ამ ვიდეოში ჩაშენებული სიის შესახებ მინდა გესაუბროთ, რაც შეეხება ასეთი სიის შექმნას და ატრიბუტებს, თქვენ ამავე გვერდზე შეგიძლიათ ნახოთ შესაბამისი ვიდეოგაკვეთილები. ამ ვიდეოში ახალ ტეგებს არ შემოვიტან, რადგანაც სიის ჩაშენებას რაიმე ახალი ტეგი არ სჭირდება
იმისთვის, რომ გაიზაროთ რისი გაკეთება მინდა, გთხოვთ დააკვირდეთ საბოლოო პროდუქტს. თქვენ უნდა შექმნათ HTML კოდი, რომლის ბრაუზერში გახსნის შედეგად ვებ გვერდზე უნდა გამოისახოს წელიწადის დროების სია და შესაბამისი თვეები.
მე უკვე გახსნილი მაქვს Notepad++, სადაც თქვენ ხედავთ ბოლო ნამუშევარ დოკუმენტს. File-Save as ბრძანებით ეს ფაილი შეინახეთ მესამე გაკვეთილის საქაღალდეში. ფაილის სახელად nested list დაარქვით...........
მუშაობის გასაგრძელებლად მოვაწესრიგოთ კოდი. კომენტარის და title ტეგი არსებული ტექსტები შეცვალეთ ტექსტით „ჩაშენებული სიები.
h3 ტეგის და შემდეგი კომენტარის ტექსტი კი შეცვალეთ „წელიწადის დროები და თვეები“
გირჩევთ ოუ ელ ol ტეგის type ატრიბუტი და მნიშვნელობაც წაშალოთ, თუმცა საჭიროების შემთხვევაში შეგიძლიათ დატოვოთ ან სხვა მნიშვნელობით შეცვალოთ. ამ გაკვეთილში ეს მნიშვნელოვანი არ არის.
წაშალეთ დამხურავი მარჯვნივ დახრილი ხაზი იუ ელ/ul ტეგის შემდეგი ტექსტი დამხურავი მარჯვნივ დახრილი ხაზი ბადი /body ტეგამდე.
გააკეთეთ კომენტარის და მთელი დანომრილი სიის ელემენტის ასლი. კურსორი გადაიყვანეთ გაზაფხულის დამხურავი ელ აი /li ტეგის წინ, დაამატეთ ახალი აბზაცი და ამ აბზაცზე ჩასვით დამახსოვრებული კოდი.
მარტივი მისახვედრია რომ ამ ტეგში უნდა ჩაიწეროს გაზაფხულის სამი თვის სახელები. ამიტომ წაშალეთ ელ აი li ტეგის შემედგენლობა სამ სტრიქონზე, ხოლო მეოთხე სტრიქონი სულაც არ არის საჭირო. ზუსატად ანალოგიური კოდი გჭირდებათ დანარჩენი წელიწადის სამი დროისთვის. ამიტომ გააკეთეთ მიღებული კოდის ასლი დამხურავ მარჯვნივ დახრილი ხაზი ელ აი /li ტეგამდე.
კურსორი გადაიყვანეთ ზაფხულის ელემენტის დამხურავი მარჯვნივ დახრილი ხაზი ელ აი /li ტეგის წინ დაამატეთ ახალი აბზაცი და ჩასვით დამახსოვრებული ტექსტი.
იგივე კოდი ჩასვით შემოდგომის და ზამთრის დამხურავი მარჯვნივ დახრილი ხაზი ელ აი /li ტეგის წინ.
ახლა კი ისღა დაგრჩენიათ გამხსნელ ელ აი li ტეგსა და დამხურავ მარჯვნივ დახრილი ხაზი ელ აი /li ტეგებს შორის დამატოთ წელიწადის დროების შესაბამისი თვეების დასახელება. საბოლოო კოდი კი ალბათ ასე უნდა გამოიყურებოდეს, როგორც ახლა ეკრანზე ხედავთ.
მოდით შეამოწმეთ მიღებული კოდის სისწორე. დააჭირეთ დისკეტის ნახატს და დაიმახსოვრეთ კოდში შეტანილი ცვლილებები. დააჭირეთ Run- Launch in Chrome. თქვენ ხედავთ წელიწადის 4 დროის დანომრილ სიას, ყველა დროის დსახელების შემდეგ ჩამოთვლილია შესაბამის თვეების დასახელება ისევ დანომრილი სიის სახით.
მე შევაჯამებ ნანახ ვიდეოგაკვეთილს
ერთი სიის მეორეში ჩაშენება შესაძლებელია პირველი სიის ელემენტის დამხურავი მარჯვნივ დახრილი ხაზი /li ტეგის წინ მეორე სიის ჩასმით
რეფლექსიისთვის ტესტები, ნიმუშები და სავარჯიშოები შეგიძლიათ ნახოთ ვებგვერდზე devcom.ge. აქედანვე შეგიძლიათ ჩამოტვირთოთ ვიდეოგაკვეთილის რესურსები
ასევე თქვენთვის შეიძლება საინტერესო იყოს ვიდეოგაკვეთილი დანომრილი და დაუნომრავი სიების შესახებ, რომელიც განთავსებულია ამავე ვებგვერდზე.
გმადლობთ ყურადღებისთვის