>> DAVEN FARNHAM: დღეს, მე ვაპირებ გაიგო ცოტა HTML,
HyperText Markup Language.
ხედავთ HTML ყველგან ამ დღეებში.
ფაქტობრივად, თუ თქვენ თვალს ამ video ბრაუზერის, თქვენ
ხედავს HTML ახლა.
HTML არ არის პროგრამირების ენა, უფრო სწორად, ეს არის markup ენა გამოიყენება
ვებ ბრაუზერები გაწევა გვერდები ინტერნეტში.
>> ასე, რომ თქვენ ალბათ იკითხავთ, როგორ ზუსტად წერს ვებ გვერდი HTML სხვადასხვა
წერილობით პროგრამის პროგრამირების ენა, როგორიცაა C?
ისე, C არის ენის ძალიან მკაცრი სინტაქსური წესები, რომელიც უნდა იყოს
შედგენილი ადრე მას შეუძლია აწარმოებს.
თუ თქვენ ოდესმე დავიწყებას უნდა შეიცავდეს მძიმით დასასრულს განცხადება
თქვენი C კოდი, იცით, რა მე ვსაუბრობ დაახლოებით მიმართ მკაცრი სინტაქსი.
>> ბრაუზერების თუმცა, ცოტა მეტი ვაპატიოთ, როდესაც საქმე ეხება HTML.
მაშინაც კი, თუ თქვენი HTML არ არის syntactically ზუსტი, თქვენს გვერდზე კვლავ იყოს
ნაჩვენები ბრაუზერი, მაგრამ შეიძლება არ გამოიყურება, როგორც თქვენ აპირებდით.
ასე რომ ყოველთვის საუკეთესო დაიცვას წესები.
საუკეთესო გზა ინტუიცია იმაზე, თუ როგორ რამ მუშაობა
გავლა მაგალითი.
>> ასე რომ, რა გვაქვს აქ არის ძირითადი გეგმა ვებ გვერდზე.
თქვენ ალბათ შენიშნა ბევრი რამ შორის დახრილი ფრჩხილები.
ისე, ეს მხოლოდ tags.
წარწერები ძირითადად ინფორმირება ბრაუზერების რომ, hey, რაღაც
მოდის თქვენი გზა.
დამახსოვრება თუმცა, როდესაც თქვენ გახსნა tag, თქვენ უნდა დახუროს ეს ერთხელ თქვენ
გაკეთდეს გამოყენებით იგი.
>> ასე მაგალითად, გავხსნა განყოფილება კოდი ღია
bracket სხეულის ახლოს bracket.
მე მაშინ დაამატოთ ზოგიერთი ტექსტი, ამ შემთხვევაში, ჩემი პირველი ვებ გვერდზე მაშინ, როდესაც მივედი
განყოფილების დახურვა, მე თითქმის იდენტური tag გარდა ამ დროს
ველით slash ადრე ორგანო.
ზოგადად, ეს არის ფორმატი, თქვენ აპირებთ გამოიყენოთ როდესაც თქვენ გახსნით
და დახურვის tags.
ერთად, ღია tag და ბოლოს tag დაკომპლექტებას რასაც ელემენტს.
>> თუ გადავხედავთ პირველი ხაზი, თქვენ ვხედავ ძახილის წერტილი მოჰყვა
DOCTYPE html.
ეს მართლაც მხოლოდ ვეუბნებოდი თქვენი ბრაუზერის რომ ფაილი არის ვებ გვერდი
დაწერილი HTML.
HTML tag არსებითად ამბობს, აქ მოდის ზოგიერთი HTML.
მაშინ ჩვენ გვაქვს ხელმძღვანელი tag ერთად სათაური tag შიგნით.
ხელმძღვანელი tag შეგიძლიათ წარმოიდგინოთ, რომ, როგორც მოიცავს HTML კოდი, რომელიც მოდის
ნაყარი თქვენს ვებ გვერდზე რეალური შინაარსი.
>> ზოგადად, თქვენ დააყენა სათაური თქვენი ვებ გვერდი აქ, თუმცა არსებობს
სხვა tags რომელიც შეიძლება აღმოჩნდეს აქაც.
შემდეგ მოდის თქვენს ვებ გვერდზე სხეულის, ფაქტობრივი ხორცი და ძვლები თქვენი ნახვა.
ჩვენს მაგალითში, ჩვენ უბრალოდ დასვა მარტივი წინადადება, ჩემი პირველი ვებ,
რომელიც, თუ ჩვენ აწარმოებს ჩვენს საიტზე, გამოიყურება პატარა რაღაც მსგავსი.
ჩვენს ვებ გვერდზე არ არის ძალიან უცნაური, მაგრამ არ ინერვიულოთ.
ჩვენ ნაძვის it up მალე.
>> ასე რომ, ზემოთ HTML, ჩვენ მოგცემთ ძალიან ძირითადი თარგი ვებ გვერდზე,
არაფერი ლამაზი, მხოლოდ შიშველი ძვლები.
მაგრამ თუ მე შექმნაში ვებ გვერდზე, რა მოხდება, თუ მინდა დავამატო,
სურათი, ვთქვათ, თავს?
ისე, მე შემიძლია ამის გაკეთება.
არსებობს რამდენიმე გზა დაამატოთ გამოსახულება თქვენს საიტზე.
თუ სურათი არის იმავე საქაღალდეში, როგორც თქვენი HTML ფაილს, თქვენ შეგიძლიათ ლინკი
იმიჯი გავლით გზა მოსწონს ეს.
>> თქვენ გახსენით იმიჯი tag მოჰყვა მიერ ამ Alt ატრიბუტი წელს
წყარო გამოსახულება.
Alt ატრიბუტის ღირებულების არის რამოდენიმე ალტერნატიული ტექსტი შემთხვევაში მომხმარებელი ვერ
იხილეთ სურათი.
გარდა ამისა, ასევე შეგიძლიათ ბმული images მეშვეობით სრული URL, მოსწონს ეს.
ახლა, რომ ნახვა ნამდვილად არ არსებობს, მაგრამ თუ იქ სურათს
ჩემთვის, რომ მისამართი, მე ვერ გამოიყენებს წყაროს URL მოიცავს
იმიჯისთვის ჩემი ნახვა.
ნებისმიერ შემთხვევაში, თქვენ დასრულდება up ერთად გაცილებით გალამაზებაში ნახვა, რაღაც მსგავსი.
>> ისე, რომ საკმაოდ გრილი, მაგრამ მე სახის მინდა რაღაც ტექსტი აქაც.
მოდით უბრალოდ დაამატოთ რამე სუპერ მარტივი ზემოთ
გამოსახულება, როგორიცაა header.
ყველა მე ვაკეთებ ჯერჯერობით გამოიყენოთ header tag, H1 და ხაზის შესვენების tag, ძმ.
Header tag რაც შრიფტის პატარა ცოტა უფრო დიდი და უფრო ცნობილი.
ხაზი შესვენება აქვს, მეორეს მხრივ, არის ერთგვარი cool.
განსხვავებით ბევრი სხვა tags, თქვენ არ გაქვთ გახსნისა და დახურვის შესვენების tag, უბრალოდ
ერთი ნაჩვენებია ზემოთ.
ეს არის, რადგან შესვენების ვიზიტორების შინაარსი და ამიტომ, ცარიელი ელემენტს.
>> ცარიელი ელემენტებს, როგორიცაა ამ, თქვენ შეგიძლიათ გახსნათ და ახლო ერთდროულად უბრალოდ
მათ შორის ნაბიჯია slash ზე ბოლოს თავდაპირველი დეკლარაცია.
ახლა ჩემს ვებ გამოიყურება პატარა რაღაც მსგავსი.
უკეთესი, მაგრამ ეს სახის გრძნობს როგორიცაა ჩიხი.
არსებობს არსად სხვაგან წასვლა განზე ამ მთავარ გვერდზე.
კარგად, მოდით დაფიქსირება, რომ მათ შორის ბმულს.
>> რა მე ვაპირებ აქ არის გამოიყენოს მიაკუთვნოს აღინიშნება და მიიღოს
სურათის ბმული, ვთქვათ, CS50 TV.
ეს გზა, როცა ვინმე დააჭერს me, მათი ბრაუზერი იქნება მიმართული
კიდევ ერთი, ალბათ უფრო სასარგებლო ვებ გვერდზე.
მე მქონდა, რათა შეამციროს ზომა ტექსტის ცოტა იმიტომ, რომ ჩვენი ვებ გვერდი
უფრო დახვეწილი.
მაგრამ იმედია, ეს ჯერ კიდევ გაურკვეველია.
ჩემი ნახვა გამოიყურება ზუსტად იგივე მხოლოდ ახლა, როდესაც მე დააჭირეთ სურათს,
ჩემს ბრაუზერში გაიხსნება სხვა tab რომ CS50.tv ვებ გვერდზე.
>> და ბოლოს, ვთქვათ, მე ვაპირებ სტილი ამ ვებ მოგვიანებით გამოყენებით CSS.
CSS არის ის, რაც ცნობილია, როგორც კასკადური სტილების ცხრილების.
და ეს ძირითადად უზრუნველყოფს ეფექტური გზა რედაქტირება და სტილი
მსგავსი ბლოკები კოდი.
მინდა, რომ დაიწყოს ორგანიზება my HTML to გაუადვილოს სტილი მოგვიანებით.
აქ, მე შეიქმნა ორი სხვადასხვა სახის პოტენციალი, რათა დაეხმაროს ორგანიზება ჩემი კოდი.
მე გამოიყენება ID ატრიბუტის შიგნით დაყოფა, ან div tag, და მე გამოიყენება
კლასი ატრიბუტი შიგნით სხვა div ტეგით.
>> ID და კლასი ატრიბუტები მუშაობა ანალოგიურად.
ერთადერთი განსხვავება ის არის, რომ თქვენ შეგიძლიათ მხოლოდ ერთ ელემენტს, კონკრეტული ID, არამედ
ნებისმიერი რაოდენობის ელემენტები შეგიძლიათ გაზიარება კლასი.
ასე მაგალითად, შემიძლია კლასი იმიჯი რამდენჯერმე, მაგრამ მე არ შემიძლია
შევქმნათ კიდევ ერთი განყოფილება ერთად ID დაბრუნება.
მიუხედავად იმისა, რომ მე არ გადაიზარდა CSS, სხვა ენაზე გამოიყენება
ერთად HTML, ერთხელ დავიწყო სტილის ჩემი კოდი ცენტრთან, შემიძლია ამ
ორგანიზაციული ატრიბუტები გავლენა ჩემი ვებ გვერდის ესთეტიკას.
>> ყველაფერი ფარგლებში სამმართველოს დაბრუნება ექნება მსგავსი stylings ან ნებისმიერი
მეორე ჯგუფის HTML I ჯგუფი შევიდა კლასი გამოსახულება იზიარებენ მსგავსი სახეს.
ეს არის ბევრად უფრო ადვილია, ვიდრე ცდილობს რედაქტირება და სტილი გამოსახულება ან ბლოკები
ტექსტის ინდივიდუალურად.
>> ასე რომ, ჩვენ წავიდა საფუძვლებს როგორ რათა ვებ გვერდზე HTML.
HTML აქვს bunch სხვა მახასიათებლები ძალიან რომ როდესაც დაწყვილებული სხვა ენებზე
როგორიცაა CSS და JavaScript, ნამდვილად რათა გვერდები გამოირჩევა.
საუკეთესო გზა კომფორტულად HTML არის მხოლოდ სასადილო გარშემო ერთად,
რა მუშაობს და რა არა.
>> ჩემი სახელი არის Daven Farnham.
ეს არის CS50.
>> ასე მაგალითად, მე შეიძლება გამოიყენოს კლასი image -
არა, არსებობს ამდენი ატრიბუტები.
ჩემი სახელი არის Daven Farnham.
ეს არის CS 650.
მინდა ვთქვა, CSS.
ეს არის CSS.