საიტის ეს განყოფილება მთლიანად ეძღვნება საიტის შესაქმნელად ორ ენას, კერძოდ HTML და CSS. აქ შეგიძლიათ ისწავლოთ ენები ეტაპობრივად, ისწავლოთ ყველაფერი საფუძვლებიდან ყველაზე რთულ მომენტებამდე.

ეს განყოფილება აგებულია მასალის ეტაპობრივად შესწავლის პრინციპზე, შესაბამისად, HTML და CSS გაკვეთილის ყოველი სათაურის წინ არის გაკვეთილის სერიული ნომრის შესაბამისი ნომერი. ეს ბუნებრივია, თუ გინდა, რომ ყველაფერი საფუძვლიდან ისწავლო და არ გააფუჭო შენს თავში. თუ თქვენ უკვე იცით რაიმე HTML და CSS ენების შესახებ, მაშინ ასევე შეგიძლიათ აქ იპოვოთ ის ცოდნა, რომელიც აკლია, ან გაიღრმავოთ ის, რაც უკვე ისწავლეთ.

IN ამ განყოფილებასგამოქვეყნებულია გაკვეთილები HTML5 და CSS3 ენის სტანდარტებზე, თუ არის ამ ენების ახალი ვერსიები, ისინიც აისახება ამ განყოფილების ახალ გაკვეთილებზე და აუცილებლად გაიგებთ;

ალბათ ყველა ადამიანს, ვინც ცხოვრებაში ერთხელ მაინც შეხვედრია ვებსაიტის შექმნას, რა თქმა უნდა სმენია ისეთი კომბინაციის შესახებ, როგორიცაა html და css, თამამად შემიძლია ვთქვა, რომ თუ გსურთ თავად შექმნათ ვებსაიტები, მაშინ ამის ცოდნის გარეშე არ შეგიძლიათ. ორი რამ.

მას შემდეგ რაც მიიღებთ ზოგადი ცნებებითქვენს თავში აშკარად არის ორაზროვანი სურათი იმის შესახებ, თუ რა არის html და ვფიქრობ, ეს გასაკვირი არ არის. დროა გადავიდეთ პირდაპირ პრაქტიკაზე და შექმნათ თქვენი პირველი HTML დოკუმენტი.

html ენის მსგავსად, CSS-საც აქვს თავისი მახასიათებლები, წესები და სტრუქტურა. ამ გაკვეთილზე მე გეტყვით CSS ენის ძირითად ცნებებზე, მის სტრუქტურაზე, დიზაინზე და ჩვენ გავაკეთებთ პირველს CSS ცხრილისტილები და ისწავლეთ როგორ დააკავშიროთ სტილის ფურცელი html დოკუმენტთან.

სელექტორები CSS-ში თავად ენის საფუძველია და მათი სწავლა და გაგება ძალიან მნიშვნელოვანია, ამიტომ ამ გაკვეთილზე გეტყვით სელექტორების კიდევ რამდენიმე ტიპზე და აღვწერ მათ შესაძლებლობებს.

ვებსაიტის შექმნისას ძალიან მნიშვნელოვანი პუნქტია ტექსტთან მუშაობა და როგორც გესმით, თქვენ ასევე უნდა შეძლოთ ტექსტთან მუშაობა html-ში და იცოდეთ რა ტეგები არსებობს და როგორ შეიძლება მათი გამოყენება.

მას შემდეგ რაც ისწავლეთ ტექსტთან მუშაობის ყველა HTML ტეგი, ახლა დროა გადახვიდეთ პირდაპირ CSS-ზე ტექსტთან მუშაობაზე, რაც მნიშვნელოვნად გააფართოებს თქვენს ცოდნას და შესაძლებლობებს.

CSS შეიცავს ყველა სახის მოსახერხებელი და ხარისხობრივად ცვალებადი ნივთების უზარმაზარ რაოდენობას გარეგნობათვისებები და ვაგრძელებთ CSS-ის შესწავლას ტექსტთან მუშაობისას და ამ გაკვეთილზე ჩავუღრმავდებით ტექსტთან მუშაობის თემას და შევხედავთ ტექსტის ახალ თვისებებს.

სურათებთან მუშაობა ვებგვერდიდან შექმნისას არის ერთ-ერთი მთავარი პუნქტი, როგორც დიზაინის შექმნისას, ასევე თქვენი ვებსაიტისთვის რაიმე მასალის უბრალოდ განლაგების ან დაწერისას.

CSS მნიშვნელოვნად აფართოებს ნებისმიერთან მუშაობის უნარს html ობიექტები, ამ გაკვეთილზე მინდა დეტალურად გითხრათ იმ პარამეტრების შესახებ, რომლებიც შეიძლება გამოყენებულ იქნას სურათებზე.

ეს სტატია არ არის გამიზნული, რომ იყოს HTML დოკუმენტის მარკირების ენის ყოვლისმომცველი სახელმძღვანელო. იგი აღწერს HTML-ის საფუძვლებს - ამ ტექნოლოგიის ძირითად პრინციპებს, ცნებებს და განმარტებებს, რომელთა ათვისების შემდეგ შეგიძლიათ მარტივად გადახვიდეთ HTML კოდირების შესწავლაში.

მაგარია

სტამერი

გაკვეთილის შესასწავლად გადმოწერეთ არქივი საჭირო ფაილებით.

HTML არის დოკუმენტის მარკირების ენა. სწორი გამოთქმა არის HTT.

თქვენ ალბათ ოდესმე გიმუშავიათ Word დოკუმენტის რედაქტორში ან მსგავს. საოფისე აპლიკაციები? თქვენ ალბათ ეს იცით ამ ტიპისრედაქტორებს აქვთ ტექსტის რედაქტირების, ელემენტების დალაგების, სურათების ჩასმის და ა.შ. მდიდარი შესაძლებლობები.

შეიძლება გკითხოთ, რატომ წერთ ტექსტის პროცესორების შესახებ სტატიაში HTML-ზე? მაგრამ რატომ. თუ გაარკვიეთ, რა არის ოფისის რედაქტორი? ეს არის აპლიკაცია დოკუმენტების რედაქტირებისა და ჩვენებისთვის.

საკვანძო სიტყვა აქ არის დოკუმენტი. ანუ ჩვენ ვქმნით, ვასწორებთ და ვუყურებთ დოკუმენტს რომელიმე პროგრამაში, ამ შემთხვევაში - in ოფისის რედაქტორი. თუ ასეთ დოკუმენტს მარტივად გახსნით ტექსტის რედაქტორიმაგალითად, Notepad-ში ბევრ უცნაურ სიმბოლოს და ნიშანს დავინახავთ. სიმბოლოების ეს არეულობა კაცობრიობისთვის გაუგებარია, მაგრამ კომპიუტერებისთვის გასაგები. ამ შინაგანი ენის წყალობით, Word დოკუმენტიიძენს გარკვეულ სტრუქტურას და იერსახეს თავად რედაქტორში და დოკუმენტი ჩვენს წინაშე მთელი თავისი დიდებით ჩნდება ფორმატირებული ტექსტით და სურათებით მათ ადგილას.

HTML არის დოკუმენტის მარკირების ენა ბრაუზერისთვის. Word აქ არის ბრაუზერი, ხოლო დოკუმენტი არის HTML გვერდი, ეს არის HTML ტექნოლოგიის საფუძველი, რომლის გაგებაც აუცილებელია, რათა არ მოხდეს ვებ დოკუმენტების მარკირების ენა პროგრამირების ენებთან. ჩვენ HTML-ის გამოყენებით მარკირება, სადაც გვერდზე გამოჩნდება ელემენტი, სურათი ან ტექსტი და რა თანმიმდევრობით გამოჩნდება ისინი ერთმანეთის გვერდით.

დიახ, საოფისე აპლიკაციებში ტექსტის მარტივი აკრეფა და ფორმატირება პროგრამირებასთან არაფერ შუაშია. მაგრამ დაკვირვებული მკითხველი შეამჩნევს მნიშვნელოვან დეტალს - ში ტექსტის დამმუშავებელიჩვენ ვიზუალური ღილაკებისა და მენიუების გამოყენებით ვბეჭდავთ, ვასწორებთ და ვაფორმატებთ ტექსტს და სურათებს, მაგრამ რატომ იწერება HTML კოდი ხელით? რატომ ვისწავლოთ ამდენი ტექნიკური დეტალი დოკუმენტის მარკირების ჩაწერის შესახებ?

სინამდვილეში, არსებობს უამრავი რედაქტორი, რომლითაც შეგიძლიათ შექმნათ და დაარედაქტიროთ HTML გვერდები, Word-ის მსგავსი. ანუ წყაროს HTML კოდი ჩვენთვის დამალულია და ჩვენ მასში არ შევდივართ.

ერთგვარი Word HTML-ისთვის. ასეთი ვიზუალური რედაქტორებიუწოდებენ:

WYSIWYGრედაქტორები - W hat Y ou S ee I s W hat Y ou G et. ანუ, თუ რუსულად ვთარგმნით: რასაც ვხედავთ, ვიღებთ.

მე მათ ვეძახი "ვუზივოოგიებს". მიუხედავად იმისა, რომ ეს ფონეტიკურად არასწორია, ის აშკარად აჩვენებს ამ გამოგონების უაზრობას. დამწყები ძალიან ხშირად იყენებენ ასეთ რედაქტორებს თავიანთი პირველი ვებსაიტების შესაქმნელად. რა თქმა უნდა, ეს მოსახერხებელია - თქვენ არ გჭირდებათ ტეგების, დიზაინის სტილის და სხვა, ერთი შეხედვით, უსიამოვნო და რთული საგნების შესწავლა. თავად რედაქტორი ავტომატურად გარდაქმნის ჩვენს მოქმედებებს HTML კოდში.

მაგრამ, როგორც ამბობენ, უბრალოდ არაფერი ხდება. უფრო კონკრეტულად, ამ მიდგომას აქვს ძალიან სერიოზული ნაკლოვანებები. რა უშლის ყველას ვიზუალური რედაქტორების გამოყენებას HTML გვერდების შესაქმნელად? ფაქტია, რომ ამ გზით ჩამოყალიბებულ გვერდებს, როგორც წესი, აქვთ ბევრი არასაჭირო კოდი და ბევრი შეცდომა სემანტიკური თვალსაზრისით. ახლა, რა თქმა უნდა, არანაირი პრობლემა არ არის მაღალსიჩქარიანი ინტერნეტიკავშირი და გვერდის ზომის სხვაობა 400 კბ და 100 კბ სიჩქარისთვის არ არის მნიშვნელოვანი, თუმცა ოპტიმიზებული და სწორად დაწერილი HTML კოდი ბევრ პრობლემას აგარიდებს და უამრავ უპირატესობას იძლევა, კერძოდ:

• კომპეტენტური HTML კოდი დადებითად მოქმედებს საძიებო სისტემის ოპტიმიზაცია, საიტის საძიებო რობოტის მიერ ცოცვის სიჩქარე. vuzivuga-ს მიერ გენერირებული კოდის კილობაიტები მიუღებელია და საზიანოც კი;
• WYSIWYG რედაქტორის მიერ გენერირებული HTML კოდს აქვს მრავალი სემანტიკური შეცდომა. ანუ, ასეთი რედაქტორის მიერ გენერირებული ტეგები გამოიყენება სხვა მიზნებისთვის, სადაც საჭიროა მათი გამოყენება, მაგალითად, სიები
  , რედაქტორი შექმნის სხვა ტეგს, რომელიც ჩვენ არ გვჭირდება. დამოკიდებულია, რა თქმა უნდა, რედაქტორზე, მაგრამ აქ ვგულისხმობთ ვებსაიტების შექმნის კომპლექსურ გადაწყვეტილებებს და არა მარტივი რედაქტირებატექსტი ტექსტის არეში WYSIWYG-ის გამოყენებით.
  • ბევრი არასაჭირო ტეგი გენერირდება და დოკუმენტის სტრუქტურა შეშუპებულია. ვთქვათ, თქვენ გადაიტანეთ ელემენტი ასეთ პროგრამაში, ჯერ მარჯვნივ, შემდეგ მარცხნივ, შემდეგ ცენტრში - თითოეული მოქმედება ტოვებს კვალს ორიგინალური HTMLკოდი. რედაქტორი არის პროგრამა და მას არ შეუძლია იცოდეს, რა გსურთ მიიღოთ შედეგად, ის ქმნის ტონა კოდს ყველაფრის გათვალისწინებით შესაძლო ვარიანტებიდოკუმენტის ქცევა ბრაუზერში.
  • როგორც წესი, HTML კოდის ვიზუალური დიზაინის რედაქტორები სწრაფად ხდება მოძველებული. და პროფესიონალების მხრიდან ინტერესის ნაკლებობის გამო, ისინი საერთოდ მოკლებულნი არიან მხარდაჭერას და წყვეტენ განვითარებას. და HTML ვითარდება. ყველაფერი ვითარდება ვუზივოგის გარდა. შესაბამისად, მათ არ შეუძლიათ შექმნან სწორი და თანამედროვე კოდი, რომელიც გამოიყენებდა ახალ ფუნქციებსა და გადაწყვეტილებებს.
  • ასეთი პროექტების მხარდაჭერა და განვითარება ზეციური სასჯელია. შაბლონების გამოყენების შესახებ და ხელახალი გამოყენებასაერთოდ არ შეიძლება არსებობდეს მეტყველების კოდი.

  ასე რომ, ჩვენ დავწერთ HTML მხოლოდ კალმებით. ვიზუალური HTML რედაქტირებისთვის ადექვატური ხელსაწყოები ჯერ არ არის გამოგონილი და ნაკლებად სავარაუდოა, რომ გამოჩნდეს. HTML მარკირების ენა მარტივია შესასწავლად და გასაგებად, და არსებობს მრავალი ინსტრუმენტი HTML კოდის ჩაწერის ავტომატიზაციისთვის, მაგრამ ამაზე მეტი სხვა გაკვეთილებში.

  WYSIWYG რედაქტორთან მცირე ფიქრის შემდეგ, ახალგაზრდა HTML გურუები ტოვებენ ამ უშედეგო ამოცანას და გადადიან.

  სტრუქტურა HTML დოკუმენტი

  კლასებისთვის გირჩევთ ჩამოტვირთოთ და დააინსტალიროთ Sublime Text რედაქტორი. უაღრესად გირჩევთ, არ გამოიყენოთ ჩაშენებული Windows Notepad HTML განლაგებისთვის, თუ არ გსურთ თქვენი ფსიქიკა დაარღვიოთ HTML-ის სწავლის ადრეულ ეტაპზე.

  გადავწყვიტეთ, რომ HTML დოკუმენტის კოდი ხელით ჩაგვეწერა, ანუ აკრიფეთ. HTML განლაგება - პროცესი HTML შექმნადოკუმენტი. ჩვეულებრივ ხალხში და ინფორმირებულ წრეებში, ეს მხოლოდ განლაგებაა. ნებისმიერ დოკუმენტს აქვს სტრუქტურა და მშენებლობის გარკვეული წესები. რა ელემენტებისაგან შედგება კოდი, როგორია HTML-ის სტრუქტურა?

  მოდით შევქმნათ კომპიუტერზე საწყისი შაბლონი - index.html ფაილი, გავხსნათ ის რედაქტორის გამოყენებით და ჩასვით მასში შემდეგი კოდი:

  Header Document Body გთხოვთ გაითვალისწინოთ, რომ HTML დოკუმენტებს აქვთ .html გაფართოება.

  ასე რომ, მაგალითიდან თანმიმდევრობით.

  - დოკუმენტის ტიპი (დოქტიპი)

  ეს კონსტრუქცია ყოველთვის მითითებულია დოკუმენტის დასაწყისში, რათა ბრაუზერმა სწორად „გაიგოს“ HTML-ის რომელი ვერსიაა გამოყენებული დოკუმენტის აგებისას.

  იმის გამო, რომ HTML მუდმივად ვითარდება, მას აქვს რამდენიმე ვერსია, ისევე როგორც სხვა პროგრამული პროდუქტი. HTML-ის მიმდინარე ვერსია მეხუთეა და მაგალითში მოცემული დოქტიპი არის მიმდინარე.

  პრინციპში, არანაირი აზრი არ აქვს დოკუმენტის ტიპების შესწავლას, რადგან HTML5-ის გამოშვებით ეს დიზაინიგახდა სტანდარტი. უბრალოდ ჩადეთ იგი დოკუმენტის დასაწყისში, ყოველ ჯერზე, როდესაც დაიწყებთ ვებგვერდის განლაგების შექმნას.

  - დოკუმენტის დასაწყისი

  პირველი ტეგი, რომელსაც ჩვენ ვხედავთ დოქტიპის შემდეგ არის .

  HTML ტეგი - სტრუქტურული ერთეული HTML დოკუმენტის მარკირება. HTML კოდი შედგება სამშენებლო ბლოკებისგან, რომელსაც ეწოდება ტეგები. თითოეულ ტეგს აქვს თავისი ფუნქცია და HTML მარკირების ენის სწავლა საბოლოო ჯამში არის დოკუმენტში ტეგებისა და მათი თვისებების შესწავლა.

  მინდა აღვნიშნო, რომ HTML-ის სწავლა არც ისე რთულია, როგორც ერთი შეხედვით ჩანს. დოკუმენტის მარკირებაში გამოყენებული ტეგების სწავლა არც ისე ადვილია. მძიმე დატვირთვატვინზე.

  ასე რომ, დოკუმენტის მარკირება იწყება ტეგით და მთავრდება დახურვის ტეგით. ყველა ტეგი, რომელიც შეიცავს სხვა ტეგებს ან ელემენტებს, უნდა დაიხუროს დახურვის ტეგით. მაგალითად, , , და ა.შ.

  ტეგი სავალდებულოა, რადგან ის შეიცავს დოკუმენტის მთელ სტრუქტურას და წარმოადგენს სხვა ელემენტების შეფუთვას.

  მონიშნეთ

  შემდეგი, ჩვენ ვხედავთ ტეგს, რომელიც შეიცავს სხვა ელემენტებს, რომლებიც ჩვენთვის ჯერ კიდევ არ არის ნათელი. შეიცავს სხვა ელემენტებს - ეს ნიშნავს, რომ ელემენტები ან ტეგები მდებარეობს კონსტრუქციის გახსნისა და დახურვის ტეგებს შორის:

  შინაარსი ან სხვა ტეგები

  ტეგის მიზანია შეინახოს HTML დოკუმენტის მეტა ინფორმაცია, ანუ ინფორმაცია, რომელიც არ არის ნაჩვენები თავად დოკუმენტში, მაგრამ მნიშვნელოვანია და დიდწილად განსაზღვრავს, როგორ გამოიყურება და როგორ იქცევა დოკუმენტი.
  ეს ტეგი აუცილებელია დოკუმენტში.

  ტეგი - დოკუმენტის სათაური სათაური

  სათაური არის აუცილებელი ტეგი, რომელიც შეიცავს ტექსტურ მეტა ინფორმაციას, რომელიც გამოჩნდება ბრაუზერში ან ჩანართში. ტეგი უნდა იყოს . ასევე, გამოიყენება ამ ტეგის შინაარსი საძიებო სისტემებიძიების შედეგებში დოკუმენტის ჩვენება.

  მეტა ტეგი

  მეტა ტეგი არის სპეციალიზებული ტეგი, რომელიც შექმნილია გვერდის შესახებ სტრუქტურირებული მონაცემების უზრუნველსაყოფად. მეტა ტეგები ყველაზე ხშირად გამოიყენება . მეტა ტეგები არ არის საჭირო HTML დოკუმენტის სტრუქტურაში.

  ფავიკონი

  ანიჭებს ფაილს ფავიკონის გამოსახულების მქონე დოკუმენტს. Favicon არის მინიატურული ხატულა, რომელიც ნაჩვენებია დოკუმენტის სათაურის გვერდით ბრაუზერის ჩანართში. Favicon არის გრაფიკული ფაილი, 16 x 16 (ან 32 x 32) პიქსელის ზომის, რომელსაც შეიძლება ჰქონდეს სხვადასხვა ფორმატი, როგორიცაა png, jpg, ico, gif. ტრადიციულად გამოიყენება ico ფორმატი. ანიმაციური ფავიკონებია gif ფაილებიანიმაციის შემცველი. თქვენ შეგიძლიათ ნახოთ ანიმაციური ფავიკონი, მაგალითად, VKontakte-ზე, როდესაც ახალი შეტყობინება მოდის.

  CSS დოკუმენტის სტილები

  აკავშირებს CSS დოკუმენტი HTML სტილის ფაილი.

  CSS- კასკადური HTML დოკუმენტის სტილები. თითოეულ ტეგს, რომელიც მდებარეობს ტეგში, აქვს თვისებების ნაკრები, როგორიცაა ფერი, სიგანე, სიმაღლე, პოზიცია სხვა ელემენტებთან შედარებით. ყველა ეს თვისება არის CSS სტილი, რომელიც შეიძლება ექსპორტირებული იყოს გარე ფაილში. დიზაინი აკავშირებს გარე ფაილებს HTML დოკუმენტთან, CSS სტილების ჩათვლით.

  შენიშვნა: კონსტრუქციის href თვისება განსაზღვრავს გარე ფაილის ადგილმდებარეობას. ჩვენს მაგალითში, ფაილი სტილი.cssდა favicon.ico, მდებარეობს იმავე საქაღალდეში, სადაც ფაილი index.html.

  მონიშნეთ

  არ აქვს დახურვის ტეგი.

  ტეგი შეიცავს კოდს ან javaScript ფაილის ბმულს და ყველაზე ხშირად გამოიყენება ტეგის შიგნით, თუმცა Google-ის გვერდის სიჩქარის ოპტიმიზაციის ინსტრუმენტი გირჩევთ გამოიყენოთ ეს ტეგი დოკუმენტის ბოლოს, დახურვის ტეგამდე. ჩვენს მაგალითში დაკავშირებულია გარე ფაილი script.js

  , რომელიც მდებარეობს იმავე საქაღალდეში, სადაც მთავარი index.html ფაილი.

  ასე რომ, მეგობრებო, ჩვენ გადავხედეთ ძირითად ელემენტებს, რომლებიც ყველაზე ხშირად გამოიყენება ტეგში. ამ ელემენტების გარდა, არის კიდევ რამდენიმე სხვა, რომელიც უფრო სპეციფიკური და არჩევითია.

  სხეული ანუ სხეული

  აქ იწყება ყველა სახალისო და ვიზუალურად ხელშესახები რამ დოკუმენტის HTML განლაგებაში. index.htmlგადავიდეთ პირდაპირ გვერდის ხილული ნაწილის განლაგებაზე. ყველაფერი, რასაც ჩვენ ვწერთ და განლაგებულია ტეგის შიგნით, გამოჩნდება ბრაუზერში. მოდით გავხსნათ ჩვენი ფაილი

  ბრაუზერში, რათა ნათლად დავინახოთ რას ვაკეთებთ რედაქტორში. ტეგი შეიძლება შეიცავდეს ნებისმიერს HTML ტეგები

  აუცილებელია დოკუმენტის მომზადებისა და მისი ფუნქციონირების (ფორმის) უზრუნველსაყოფად. მე გთავაზობთ ყველაზე ხშირად გამოყენებული ტეგების ცხრილს და მოკლედ აღვწერ თითოეულს. თქვენ შეგიძლიათ დაუყოვნებლივ გაუშვათ რედაქტორში მოცემული მაგალითები.	მონიშნეთ
  	აღწერა ტეგი დოკუმენტში ბმულების შესაქმნელად.
  ,	მაგალითი: ბმულის ტექსტი href ატრიბუტი განსაზღვრავს დოკუმენტს, რომლისკენაც მიიყვანს ბმული. აკეთებს ტექსტსდახრილი ან თამამი (ხაზგასმულია).
  , , , , ,	მაგალითი: დახრილი ტექსტი თამამი (ხაზგასმული) ტექსტი დოკუმენტის სათაურები. სულ არის სათაურის 6 დონე, მაგრამ პრაქტიკაში გამოიყენება მხოლოდ h1-დან h4-მდე. დოკუმენტში უნდა იყოს მხოლოდ ერთი სათაური, მონიშნული h1 ტეგით, როგორც დოკუმენტის მთავარი სათაური.
  ,	დოკუმენტების სიები. ისინი არის დანომრილი ან პუნქტიანი სია. ასეთი სიის ელემენტია ტეგი მაგალითები: ელემენტი პუნქტიანი სია 1 პუნქტი 2 დანომრილი სიის პუნქტი 1 დანომრილი სიის პუნქტი 2
  	პარაგრაფი. ეს ტეგი განსაზღვრავს ტექსტის აბზაცს, რომელიც გამოყოფილია სხვა აბზაცებისგან. რეკომენდირებულია ამ ტეგის დახურვა. მაგალითი: HTML მარკირების გარეგნობა დიდწილად განისაზღვრება CSS სტილებით. თუმცა, ზოგიერთი ვებმასტერი არჩევს არ გამოიყენოს სტილები პროექტის ადრეულ ეტაპზე.
  	სურათი. ამ ტეგის გამოყენებით, შეგიძლიათ სურათის ჩასმა HTML მარკირებაში. დარწმუნდით, რომ შეიტანეთ ალტერნატიული ტექსტი ყველა სურათისთვის - "alt" ატრიბუტი. ეს ტეგი თავისთავად იხურება. მაგალითი:
  + +	ფორმები და შეყვანის ელემენტები. ფორმები შექმნილია სერვერზე სისტემაში ინფორმაციის შესატანად. ერთგვარი უკუკავშირიმომხმარებელი და საიტი. მაგალითად, ფორმები გამოიყენება, როცა სერვერზე რაიმე შეტყობინების გაგზავნა გჭირდებათ. გარდა ამისა, ფორმებს შეუძლიათ შეასრულონ სხვა ფუნქციები, მაგრამ მთავარი ამოცანაა სერვერზე მონაცემების გაგზავნა. ამის მაგალითია შეტყობინების გაგზავნის მარტივი ფორმა, რომელშიც საიტის მომხმარებელი მიუთითებს მის სახელს, ელ. ფოსტას და ტექსტს: შეტყობინების ტექსტი.
  	განსაზღვრავს ქვესტრინგს სტრიქონში. გამოიყენება ხაზის ნაწილის სტილისთვის CSS-ის გამოყენებით. ერთ-ერთი ყველაზე ხშირად გამოყენებული ტეგი. დიზაინის გარეშე, ის არანაირად არ ვლინდება ბრაუზერში. მაგალითი: HTML-ის სწავლა, უმეტეს შემთხვევაში, არ იწვევს რაიმე სირთულეს დამწყებთათვის.
  ,	ტეგები შექმნილია დოკუმენტში ვიდეო და აუდიოს ჩასართავად. დახურვის ტეგი საჭიროა. მაგალითები: კონტროლის პარამეტრი გვეუბნება, რომ გვერდმა უნდა აჩვენოს მედია კონტენტის კონტროლი, ისევე როგორც ჩვეულებრივი აუდიო/ვიდეო პლეერი.
  	ნამდვილად სამეფო ტეგი. ყველაზე ხშირად გამოყენებული და პოპულარული ტეგივ HTML მარკირებაგვერდები. ეს არის ბლოკის ელემენტი, რომელიც შექმნილია საიტზე ბლოკების მართვისთვის. ხშირად გამოიყენება "მშვენიერი" განლაგების კონცეფცია - ეს ნიშნავს, რომ საიტზე ყველა ბლოკი განლაგებულია ამ ტეგების გამოყენებით. შეიძლება შეიცავდეს სხვა ტეგებს. მაგალითი: ტექსტი წყობილ ბლოკში ყველა ელემენტი, უმეტეს შემთხვევაში, ფორმატირებულია CSS თვისებებისტილები. დახურვის ტეგი საჭიროა.
  	ეს ტეგი ატვირთავს გარე გვერდს დოკუმენტში. მაგალითი:

  ჩვენ არ განვიხილეთ ყველა ტეგი და ეს არ არის აუცილებელი. ამ ეტაპზე. მთავარია გაიგოთ HTML-ის ძირითადი იდეა, ისწავლოთ როგორ გამოიყენოთ ზემოთ წარმოდგენილი ტეგები და შემდეგ გადახვიდეთ.

  გთხოვთ, გაითვალისწინოთ, რომ ჩართულ ფაილებში ყველა სახელი უნდა იყოს დაწერილი ლათინური სიმბოლოები, ადგილების გარეშე.

  მაგალითად, ნუ:

  ეს აუცილებელია გვერდის შინაარსის მეტი თავსებადობისთვის. გარდა ამისა, HTML კოდის დაწერის სტანდარტები კარნახობს.

  ასე რომ, ახლა ჩვენ ვიცით HTML-ის რამდენიმე საფუძვლები: რა სტრუქტურა უნდა ჰქონდეს ტიპიურ HTML დოკუმენტს, ვიცით რამდენიმე ყველაზე პოპულარული ტეგი, დროა გადავიდეთ ყველაზე გემრიელ ნაწილზე - კერძოდ, ქუქი-ფაილებზე.

  პრაქტიკული დავალება HTML განლაგებაზე

  თუ ჯერ არ გადმოგიწერიათ არქივი მაგალითებით, გააკეთეთ ეს. მაგალითად, შეგიძლიათ ნახოთ example.html ფაილი, რომელიც ასევე იყო არქივში.

• გახსენით არქივი და შექმენით index.html ფაილი საქაღალდეში შეუფუთავი ფაილებით. გახსენით შექმნილი ფაილი ტექსტური რედაქტორის გამოყენებით ამაღლებული ტექსტი;
• შექმენით საწყისი დოკუმენტის სტრუქტურა doctype-ით, ტეგით, რომელიც შეიცავს და და გააგრძელეთ ტეგის შინაარსის რედაქტირება;
• გახსენით readme.txt ფაილი და შეასრულეთ შესაბამისი ამოცანები თქვენს მიერ შექმნილ index.html ფაილში. შედეგის შესამოწმებლად გახსენით index.html თქვენს საყვარელ ბრაუზერში.

ამით დასრულდა გაკვეთილი HTML-ის საფუძვლების შესახებ, შემდეგ გაკვეთილზე „CSS საფუძვლები“ ​​ჩვენ ვისწავლით როგორ ვმართოთ დოკუმენტის ელემენტების სტილები, გავიცნოთ კასკადური სტილის ფურცლები, ვისწავლოთ როგორ გამოვიყენოთ სტილის კლასები და გავხადოთ ჩვენი განლაგება ლამაზი და ფერადი. .

კეთილი იყოს თქვენი მობრძანება ჩემი ბლოგის გვერდებზე. HTML არის მარტივი მარკირების ენა, რომელიც გამოიყენება ვებ გვერდების შესაქმნელად. მე ვთქვი, რომ ეს მარტივია, ასე რომ თქვენ არ შეგაშინებთ მისი სწავლით. html ენა უბრალოდ იდეალურია დამწყებთათვის - ბევრად უფრო რთულია პროგრამირების ენის დაუყოვნებლივ დაუფლება ნულიდან, მაგრამ html სინამდვილეში ბევრად უფრო მარტივია.

ამ სტატიაში მინდა გითხრათ, როგორ ისწავლოთ ეს ენა ყველაზე სწრაფად და ეფექტურად, რათა ერთ-ორ თვეში ის მშვენივრად იცოდეთ. როგორ ფიქრობთ, შეუძლებელია? დავიწყე html-ის სწავლამარტის ბოლოს. მაისის ბოლოს უკვე უპრობლემოდ ვიცოდი სამუშაოსთვის საჭირო ტეგების 90%.

როგორ ვისწავლოთ ენა უფასოდ?

რა თქმა უნდა, ყველაზე სწრაფი სწავლისთვის, თქვენ უნდა იპოვოთ რამდენიმე სასარგებლო საიტი. პირველ რიგში, დაგჭირდებათ html მითითება. გამოცდილი პროგრამისტებიც კი იყენებენ მას, რადგან უბრალოდ შეუძლებელია თქვენს თავში შეინახოთ ათობით ტეგი და მათი ატრიბუტები.

საცნობარო წიგნებიდან შემიძლია გირჩიოთ - htmlbook. ეს მართლაც მაგარი საიტია, რომელიც აგროვებს ყველა ტეგს და აჩვენებს მათთან მუშაობის შედეგს დეტალური აღწერა. მაგრამ საცნობარო წიგნი მხოლოდ დამატებითი ინსტრუმენტია, ყველაზე დიდი ეფექტის მიღწევა შესაძლებელია რეალური პრაქტიკით.

ინტერაქტიული კურსები

და აქ მე ვსაუბრობ ინტერაქტიულ კურსებზე. ეს არის კოდის დაწერის და დაუყოვნებლივ ნახვის შესაძლებლობა. კურსების განმავლობაში მოგეცემათ დავალებები. პირველი, მარტივი, მაგალითად, ტექსტის სათაურად გადაქცევა ან ცხრილის გაკეთება. მაშინ უფრო რთულია. საბოლოოდ თქვენ გაიგებთ, თუ რა შეგიძლიათ გააკეთოთ HTML-ით. თუ ფიქრობთ, რომ ამაში უნდა გადაიხადოთ, ცდებით.

მშვენიერი საიტია html და css კურსებით. პირველი 16-18 კურსი უფასოა! თუ გსურთ გააგრძელოთ სწავლა და მიიღოთ წვდომა ფასიანზე, მოგიწევთ თვეში 300 რუბლის გადახდა ან წელიწადში 1800. პირადად მე გადავიხადე 300 მანეთი, დავასრულე ყველა ფასიანი კურსი ერთ თვეში და დიდი სარგებელი მივიღე მისგან.

ჩანაწერების მნიშვნელობა

კიდევ ერთი რჩევა ჩემგან - დაწერეთ! ჩაწერეთ ყველა ინფორმაცია, რომელიც თქვენთვის ახალი და მნიშვნელოვანია. ჩაწერის გარეშე, თქვენ რისკავთ არ შეინახოთ საჭირო ცოდნა თქვენს მეხსიერებაში. პირადად მე მაქვს სამი ზოგადი რვეული თაროზე, თითქმის მთლიანად ნაწერით სავსე და დროდადრო ვათვალიერებ, როცა ესა თუ ის ქონება მავიწყდება.

html და css-ის პარალელური შესწავლა

HTML არის მხოლოდ ერთი ვებ ტექნოლოგია, რომელიც ეხმარება შექმნას ვებ გვერდის სტრუქტურა და განლაგება. CSS მთლიანად პასუხისმგებელია დიზაინის ვებსაიტების განვითარებაში. ეს ენები ერთდროულად უნდა ისწავლონ, რადგან ისინი ურთიერთობენ ერთმანეთთან.

დამოუკიდებელი პრაქტიკა

გარკვეული ცოდნის მიღების შემდეგ, შეგიძლიათ დამოუკიდებლად ივარჯიშოთ. როგორ გავაკეთოთ ეს? სცადეთ სტატიის განლაგება სურათებით, ცხრილით, ჩადგმული სიით, მარტივი ორსვეტიანი გვერდის განლაგებით ან სხვა რამით. თქვენ უნდა ივარჯიშოთ, რადგან ეს არის ერთადერთი გზა, რომ სწრაფად ჩანერგოთ თქვენს ტვინში იმის გაგება, თუ როგორ მუშაობს ყველაფერი. ყველაზე კარგი, რა თქმა უნდა, ის არის, რომ ამ საკითხში მასწავლებელად იპოვო, მაგრამ, სავარაუდოდ, ამის გადახდა მოგიწევს.

გაკვეთილები webformyself გუნდისგან

Webformyself არის მშვენიერი ინტერნეტ პორტალი, რომელიც გთავაზობთ უამრავ ინფორმაციას ვებსაიტის შექმნის შესახებ. მათ ვებსაიტზე შეგიძლიათ იპოვოთ ბევრი უფასო სტატია HTML, CSS და ვებგვერდის განლაგებაზე, მაგრამ მათ ასევე გამოუშვეს ფასიანი ვიდეო გაკვეთილები, რომელთა მიზანია რაც შეიძლება სწრაფად გადმოგცეთ სასარგებლო ცოდნა.

დღის ბოლოს, თქვენ უნდა გქონდეთ მიზეზი, თუ რატომ სწავლობთ ამ ვებ ტექნოლოგიებს. ეს ჩვეულებრივ კეთდება იმისთვის, რომ ისწავლოთ როგორ შექმნათ ვებგვერდის განლაგება საკუთარ თავს. თუ თქვენც გაქვთ ეს მიზანი, მაშინ თქვენთვის შესანიშნავი ვარიანტი იქნება პრემიუმ გაკვეთილებზე წვდომის შეძენა webformyself.com-ზე. შედეგად, თქვენ შეგიძლიათ მიიღოთ არა მხოლოდ HTML და CSS გაკვეთილებზე წვდომა, არამედ მრავალი სხვა. მაგალითად, JavaScript და WordPress.

აქ არის ბმული პრემიუმ განყოფილების აღწერილობაზე. აქ არის სასარგებლო გაკვეთილები, მათ შორის შესაძლებლობა შეადგინოთ თქვენი პირველი განლაგება გაკვეთილების გამოყენებით. ეს ძალიან მნიშვნელოვანია, რადგან თქვენ მიიღებთ კარგ პრაქტიკას, რის შემდეგაც თქვენ შეძლებთ საკუთარი უნარების გაუმჯობესებას, ცდილობთ შექმნათ სხვა განლაგება საიტებისთვის, რომლებსაც ინტერნეტში ნახავთ.

რამდენი დრო სჭირდება ენების სწავლას?

საშუალოდ, HTML და CSS-ის სწავლა ძალიან სწრაფად შეიძლება სწორი მიდგომა. მაგალითად, რამდენიმე თვე დამჭირდა. თუ იცით, სად მიიღოთ ცოდნა, სწავლის პროცესი შეიძლება რამდენჯერმე დაჩქარდეს.

მე მოგეცით კარგი საიტები სასარგებლო მასალებით - მაშინ ეს თქვენზეა. პრინციპში, ზემოაღნიშნული რესურსები საუკეთესოა ინტერნეტში. მაგალითად, ას ათასზე მეტმა ადამიანმა გაიარა კურსები Htmlacademy-დან და 87 ათასზე მეტმა ადამიანმა გამოიწერა Webformyself განახლებები.

HTML ნიშნავს H yper T ext M arkup L ენას, ე.ი. ჰიპერტექსტის მარკირების ენა არის ვებ გვერდების ძირითადი სამშენებლო ბლოკი, რომელიც გამოიყენება ვებ გვერდების შესაქმნელად და ვიზუალურად წარმოდგენისთვის.

HTML ამატებს მარკირებას უბრალო ტექსტს. ჰიპერტექსტი შეიცავს სხვადასხვა ბმულს, რომლის მეშვეობითაც ვებ გვერდები ერთმანეთთან არის დაკავშირებული. HTML-ით ყველას შეუძლია შექმნას როგორც სტატიკური, ასევე დინამიური ვებსაიტები. HTML არის ენა, რომელიც აღწერს ვებ დოკუმენტის შინაარსის სტრუქტურას და სემანტიკას. ვებ გვერდის შინაარსი მონიშნულია ტეგების გამოყენებით, რომლებიც წარმოადგენს HTML ელემენტებს. ასეთი ელემენტების მაგალითებია, , და ასე შემდეგ. ეს ელემენტები ქმნიან სამშენებლო ბლოკებს ნებისმიერი ვებსაიტისთვის.

HTML გამოიგონა 1991 წელს მეცნიერმა ტიმ ბერნერს-ლის მიერ და თავდაპირველად გამიზნული იყო სხვადასხვა უნივერსიტეტის მეცნიერებს შორის დოკუმენტების გაცვლისთვის. თავისი გამოგონებით ტიმ ბერნს-ლიმ საფუძველი ჩაუყარა თანამედროვე ქსელიინტერნეტი.

HTML-ის რამდენიმე ვერსია არსებობს. ენის სტანდარტი მუდმივად განახლდება და ავსებს, რის შედეგადაც იგი თითქმის ყოველწლიურად ქვეყნდება ახალი ვერსია HTML. ვერსია "HTML 2.0" იყო პირველი სტანდარტული HTML სპეციფიკაცია, რომელიც გამოქვეყნდა 1995 წელს. HTML 4.01 არის HTML-ის ძირითადი ვერსია, რომელიც გამოქვეყნდა 1999 წლის ბოლოს და ფართოდ გამოიყენება დღეს. დღეს ყველაზე პოპულარული ვერსიაა HTML-5, რომელიც არის HTML გაფართოება 4.01 და გამოქვეყნდა 2012 წელს.

HTML დოკუმენტი ან ვებ გვერდი მარტივია ტექსტური დოკუმენტიშეიცავს ტეგებს (რომლებიც თავის მხრივ არიან უბრალო ტექსტში, ჩასმულია კუთხის ფრჩხილებში). ვებ გვერდის აკრეფა შესაძლებელია როგორც ჩვეულებრივ ტექსტურ რედაქტორში (Notepad, WordPad, Word და ა.შ.) ან სპეციალიზებულში კოდის ხაზგასმით (Notepad++, Sublime Text და ა.შ.). HTML დოკუმენტები ინახება ფაილების სახით გაფართოებით .htm ან .html.

ონლაინ მაგალითები ყველა გაკვეთილზე

მასალის წარმოდგენისას, თითოეულ გაკვეთილზე მოცემულია მაგალითები, რომლებიც დაგეხმარებათ გაიგოთ თითოეული კოდი დეტალურად და, პრაქტიკით, ისიამოვნოთ სწავლით. ჩვენი ონლაინ HTML რედაქტორის საშუალებით შეგიძლიათ დაარედაქტიროთ HTML დოკუმენტი და შემდეგ დააწკაპუნოთ ნარინჯისფერ ღილაკზე "Run" რედაქტორში, რომელიც მდებარეობს მარცხენა რედაქტორის ფანჯრის ზემოთ შედეგის სანახავად. თუ იყენებთ სპეციალიზებულ HTML რედაქტორს, მაშინ შეგიძლიათ დააკოპიროთ მაგალითი და ნახოთ თქვენი მუშაობის შედეგები თქვენს კომპიუტერში დაინსტალირებული ბრაუზერში.

მაგალითი HTML: თავად სცადე


გვერდის სათაური

ეს არის სათაური


ეს არის აბზაცი.



ონლაინ HTML მაგალითები

HTML სახელმძღვანელო გთავაზობთ 100-ზე მეტ ონლაინ მაგალითს, რომელიც დაგეხმარებათ მარტივად დაეუფლოთ მარკირების ენას. სჯობს ერთხელ ნახო, ვიდრე ასჯერ მოსმენა! თეორია პლუს პრაქტიკა არის თქვენი წარმატების გასაღები HTML-ის დაუფლებაში.

ამ სერიით მინდა გავხსნა HTML-ისადმი მიძღვნილი გაკვეთილების სერია. მე მივიღე ეს გადაწყვეტილება, რადგან მსურს შევეცადო მომხმარებლებს ვასწავლო ვებსაიტების შექმნა ნულიდან. ეს აზრი დიდი ხანია მიტრიალებს თავში. ერთადერთი კითხვა, რომელიც გაჩნდა, იყო სად უნდა დავიწყოთ, HTML-ით ან პირდაპირ გავაგრძელო ძრავის დაყენება და შემდგომი კონფიგურაცია.

მაგრამ თუ დაიწყებთ ძრავის სწავლით, მაშინ ზოგიერთი მომხმარებელი, ვინც არ იცის HTML, დარჩება გარეთ. ამიტომ გადავწყვიტე საფუძვლებით დამეწყო და ისე გამეკეთებინა, რომ ნებისმიერი დამწყებიც კი გაერკვია რა და როგორ.

რა არის HTML?

თავად აბრევიატურა ნიშნავს ჰიპერტექსტის მარკირების ენას (HyperText Markup Language).

მარტივად რომ ვთქვათ, HTML არის სპეციალური მარკირების ენა, რომელიც ეუბნება ბრაუზერს, თუ როგორ უნდა აჩვენოს კონკრეტული ვებ გვერდი. ანუ რა შრიფტით უნდა იყოს ნაჩვენები ტექსტი, რა თანმიმდევრობით უნდა იყოს დალაგებული ელემენტები, რომელი ელემენტები იყოს ხაზგასმული და ა.შ. და იმის მიხედვით, თუ რომელ ელემენტს ხვდება ბრაუზერი, თავად ბრაუზერში დადგენილი წესების შესაბამისად. , ეს ელემენტი გამოჩნდება ისე, როგორც ნაჩვენები. თუმცა, ეს წესები შეიძლება შეიცვალოს, მაგრამ მე ვისაუბრებ ამაზე ჩემს შემდეგ გაკვეთილებზე, რომელიც დაეთმობა CSS-ს.

მე ვთავაზობ დავიწყოთ უმარტივესი ვებ გვერდის მაგალითზე, რომელიც შეიძლება იყოს. ახლა თქვენ არ უნდა გაამახვილოთ ყურადღება იმაზე, თუ რას ნიშნავს ეს ან ის ტეგები. ყველაფრის დრო არის, დამწყებთათვის, უბრალოდ მიაქციეთ ყურადღება, სად არის ყველაფერი კოდში და როგორ უკავშირდება ეს ყველაფერი ბრაუზერში გამოსახულს. განვიხილოთ HTML დოკუმენტის მაგალითი:

გვერდის სათაური ერთი დღე ჩემს ცხოვრებაში. მზადება კონცერტისთვის

დღეს ადრე გავიღვიძე, რადგან მძიმე დღე მელოდა წინ. დღეს ხომ კონცერტზე ასი მაყურებლის წინაშე უნდა გამოვიდე. და იმისთვის, რომ ყველაფერი კარგად იყოს, უნდა გავიმეორო სარეპეტიციო პროგრამა

რეპეტიცია

ყველაფერი უპრობლემოდ ჩაიარა. ჩვენი გუნდიდან რიტმი არავის დაუკარგავს და როგორც იქნა, ყველა ტყუილად ღელავდა.

კონცერტი

ყველამ კარგად გამოსცა, თუმცა ვფიქრობ, იყო მომენტი, როცა ჩვენმა დრამერმა ტემპი დაკარგა. მაგრამ ჩვენ ჭკვიანურად გამოვედით სიტუაციიდან.

პირველ რიგში, თქვენ უნდა აკრიფოთ ეს ტექსტი ზოგიერთ ტექსტურ რედაქტორში (მე ყველაზე მოსახერხებელია Notepad ++) და შეინახოთ ფაილი სახელით index .html სადმე თქვენს დისკზე. ზე ორმაგი დაწკაპუნებითშენახულ ფაილზე ნახავთ გვერდს, რომელიც დაახლოებით ასე გამოიყურება.

გთხოვთ გაითვალისწინოთ, რომ თავად ტეგები არ არის ნაჩვენები, მაგრამ ნაჩვენებია თავად შინაარსი, რომელიც მდებარეობს მათ შორის. და აქედან შეგიძლიათ დაასკვნათ, რომ ტეგები HTML-ში დიზაინის ელემენტად მოქმედებენ.

შეხედე წყარო კოდი. როგორც უკვე შენიშნეთ, სიტყვა „ერთის“ წინ არის პატარა ჩანაწერი. თუმცა, ბრაუზერმა ის არ გაითვალისწინა, უბრალოდ, ჩუმად გადაყლაპა, თითქოს არასოდეს არსებობდა. უფრო მეტიც, თუ ცდილობთ სიტყვებს შორის ბევრი ინტერვალი დადოთ, ბრაუზერის მიერ ისინი ყველა აღიქმება, როგორც ერთი სივრცე - HTML-ს აქვს ეს ფუნქცია.

და აქ არის კიდევ ერთი რჩევა: HTML კოდის წერისას, ივარჯიშეთ იმ ტეგების ჩაღრმავებაზე, რომლებიც ჩადგმულია სხვებში. მაგალითად, სათაური და სხეულის ტეგები მოთავსებულია html ტეგში. ეს ნიშნავს, რომ როდესაც წერთ ამ ტეგებს, არ დაგავიწყდეთ მათი შესაბამისად შეწევა. როგორც წესი, ისინი კეთდება ორი სივრცის ან ჩანართის გამოყენებით - ეს გემოვნების საკითხია. რატომ არის ეს საჭირო? ახლა, დოკუმენტის იმ პატარა ნაჭერში, რომელიც ზემოთ მოვიყვანე მაგალითად, ბევრი ინფორმაცია არ არის, ამიტომ საკმაოდ პრობლემურია იქ დაბნეულობა. თუმცა, თუ გვერდზე ბევრი ჩასმული ელემენტია, მაშინ არაფერი იქნება უფრო ადვილი, ვიდრე დაიკარგო ამ უზარმაზარ კოდში და გაგიჭირდეს იმის გარკვევა, დოკუმენტის რომელ ნაწილში ხარ ახლა. ამიტომ ჯობია მაშინვე მიეჩვიო კარგ სტილს, მერე შენ თვითონ მიხვდები და მომავალშიც კარგად გამოგადგება.

ასევე ღირს ტეგების მინიმალური მინიმალური მითითება, რომელიც უნდა იყოს HTML დოკუმენტში. ამ ნაწილზე მაქვს საუბარი:

მაგრამ მაშინაც კი, თუ ეს ნაწილი აკლია, ბრაუზერების უმეტესობა თვალს ხუჭავს ამ ყველაფერზე და მაინც აჩვენებს თქვენს გვერდს. თუმცა, კოდის წერის ისეთი უაზრო სტილი, რომელშიც ადამიანს ენატრება დიდი რაოდენობატეგები ცუდად იწერება, ამიტომ მიზანშეწონილია, რომ ყველა ეს ელემენტი თქვენს გვერდზე გქონდეთ ნებისმიერ შემთხვევაში. წინააღმდეგ შემთხვევაში, ამან შეიძლება შეუქმნას თავსებადობის პრობლემა სხვა ბრაუზერებთან, რამაც საბოლოოდ შეიძლება გავლენა მოახდინოს თქვენი საიტის გარეგნობაზე და, შედეგად, ტრაფიკზე.

გარდა ამისა, შეგიძლიათ დაწეროთ კომენტარები HTML დოკუმენტში - ეს არის წმინდა სერვისის ინფორმაცია, რომელიც განკუთვნილია მხოლოდ თქვენთვის. როგორც წესი, ეს არის რამდენიმე მნიშვნელოვანი შენიშვნა, რომელიც თქვენთვის შეხსენების ფუნქციას ასრულებს ან უბრალოდ ღირს ყურადღების მიქცევა. კომენტარები არ მუშავდება ბრაუზერის მიერ, რაც ნიშნავს, რომ მომხმარებელი მათ ვერ დაინახავს. ისინი ჩვეულებრივ ასე იწერება:

ახლა შევეცადოთ თავად გავარკვიოთ, რაზეა პასუხისმგებელი ჩვენს ზემოთ მოცემულ მაგალითში მოცემული ტეგი.

html ტეგი ნიშნავს, რომ იწყება html კოდის გამომავალი.

ხელმძღვანელი – სამსახურის ინფორმაციის განყოფილება. სხვა საკითხებთან ერთად, არის სათაური, რომელიც პასუხისმგებელია ბრაუზერის ფანჯრის სათაურის ტექსტზე. ეს განყოფილება ასევე შეიძლება განიხილებოდეს, როგორც ინფორმაცია, რომელიც გვინდა ვუთხრათ ბრაუზერს ამ გვერდის შესახებ.

სხეული – იწყება დოკუმენტის ძირითადი ნაწილი.

h 1 – სათაური.

h 2 – სუბტიტრები.

p – აბზაცი.

ალბათ სულ ესაა! თუ ეს იყო თქვენი პირველი HTML დოკუმენტი, მაშინ გილოცავთ! დიახ, ის არც ისე მშვენივრად გამოიყურება, როგორც ჩვენ გვსურს. მაგრამ მიუხედავად ამისა, გვაქვს მასალა, რომელზეც უკვე შეგვიძლია მუშაობა. შემდეგ გაკვეთილებზე კი ყველაფერი კიდევ უფრო საინტერესო იქნება და ნელ-ნელა შევეხებით კასკადურ სტილის ფურცელებთან (CSS) მუშაობას.

• < Назад

კომენტარისთვის საჭიროა დარეგისტრირება.