>> DOUG LLOYD: Bel蓹likl蓹, biz s蓹rf about-- m蓹nim riyaziyyat do臒ru 蓹g蓹r,
v蓹 m蓹n hesab edir蓹m ki, back-- axtar谋r edir蓹m biz s枚hb蓹t t蓹xmin蓹n 35 videolar s蓹rf
b蓹lk蓹 C m眉xt蓹lif aspektl蓹ri haqq谋nda bir az daha, b蓹lk蓹 bir az az.
V蓹 biz 蓹hat蓹 etm蓹yib C h蓹r 艧ey, lakin biz
b枚y眉k bir y谋臒谋n 蓹hat蓹 dil, onun b枚y眉k 蓹ks蓹riyy蓹ti,
蓹lb蓹tt蓹 眉mumi istifad蓹 眉莽眉n.
陌ndi biz dan谋艧maq olacaq haqq谋nda ba艧qa bir dil, HTML.
V蓹 biz 蓹hat蓹 olacaq yaln谋z bir video.
>> Amma ki, OK olacaq.
Bu, h蓹qiq蓹t蓹n olmaq olacaq bir 艧ey 眉莽眉n istifad蓹 almaq olacaq.
陌ndi ki, bir dil 蓹saslar谋,
bu, h蓹qiq蓹t蓹n olduqca asand谋r ba艧qalar谋 枚yr蓹nm蓹k ba艧lamaq 眉莽眉n.
Bel蓹likl蓹, biz ba艧lamaq olacaq bir az geri add谋m
v蓹 蓹sas 眉z蓹rind蓹 par谋lt谋 bu dill蓹r aras谋nda f蓹rql蓹r
v蓹 sort bu t蓹rk.
H蓹qiq蓹t蓹n b枚y眉k bir 莽ox var internet, on resurslar谋 olan
Biz siz蓹 istiqam蓹tl蓹ndir蓹n ba艧lamaq olacaq internet, 莽眉nki do臒ru
m蓹lumat geni艧 depo.
V蓹 bel蓹 ki, laz谋md谋r siz蓹 kimi deyil m眉tl蓹q h蓹yata itirm蓹k
m蓹lumat olan deyil bir video 蓹hat蓹.
Siz h蓹l蓹 蓹ld蓹 ed蓹 bil蓹rsiniz h蓹r 艧ey siz蓹 laz谋m v蓹 istifad蓹
茝g蓹r siz art谋q var bilik C anla艧ma il蓹 in艧a
bu 眉莽眉n 枚yr蓹nm蓹 curve etm蓹k h蓹qiq蓹t蓹n dig蓹r dill蓹rd蓹 bir 莽ox flatter.
S枚z verir蓹m.
>> Amma bir dil haqq谋nda dan谋艧maq ed蓹k h蓹r web h蓹qiq蓹t蓹n fundamental var
HTML s蓹hif蓹.
HTML Hyper Text Markup Language edir.
HTML bir dil ancaq o bir proqramla艧d谋rma dili.
>> HTML d蓹yi艧蓹nl蓹rin yoxdur.
Bu m蓹ntiq yoxdur v蓹 ya funksiyalar谋 v蓹 ya bu kimi bir 艧ey.
Biz h蓹r hans谋 bir ed蓹 bilm蓹z HTML 枚zl眉y眉nd蓹 proqramla艧d谋rma.
B蓹z蓹n duyars谋n谋z insanlar 枚zl蓹rini t蓹svir
HTML proqram莽谋lar kimi olan tamamil蓹 d蓹qiq deyil.
Biz HTML proqramlar谋 yaza bilm蓹z.
>> HTML yaln谋z m蓹tn q蓹d蓹r qeyd etm蓹k 眉莽眉n istifad蓹 olunur.
Bu bi莽imlendirme dili deyirl蓹r.
V蓹 bu markup-- does-- n蓹 biz HTML v蓹 bu tags-- tags istifad蓹
bu semantically markup-- bir s蓹hif蓹 strukturu m眉蓹yy蓹n
v蓹 d眉z m蓹tn s蓹b蓹b olur ki, tags t蓹fsir edil蓹 aras谋nda m枚vcud
m眉xt蓹lif yollarla brauzerl蓹r t蓹r蓹find蓹n.
V蓹 b蓹lk蓹 d蓹 izah etm蓹k 蓹n yax艧谋 bir ill眉strasiya bu yol.
>> Burada 莽ox sad蓹 HTML s蓹hif蓹 deyil HTML proqram, yen蓹 bir HTML s蓹hif蓹.
V蓹 biz bu bilirik HTML s蓹hif蓹 biz, 莽眉nki
HTML tags h蓹r 艧eyi h蓹ms蓹rh蓹ddir.
Bel蓹 ki, bu HTML tag kimi g枚r眉n眉r.
Bu bucaq m枚t蓹riz蓹d蓹 aras谋nda var.
V蓹 biz 眉st bildiri艧 HTML v蓹 莽ox alt,
Biz n蓹 etdik sonra y蓹qin dig蓹r HTML bir 莽ox,
biz bucaq bracket 莽izgi HTML var.
Bel蓹 ki, sort s蓹rh蓹d HTML n蓹dir v蓹 n蓹 deyil aras谋nda.
V蓹 蓹lb蓹tt蓹 ki, 艧蓹rti, yaln谋z Siz C proqramlar谋 b眉t眉n yazd谋
dot C uzant谋lar谋 il蓹, HTML fayllar谋 b眉t眉n
dot HTML uzant谋lar谋 il蓹 sona 莽atacaq.
Amma daha 莽ox orada olacaq.
Biz yaln谋z bu HTML tags yoxdur.
Biz y蓹qin bu var 艧ey ba艧 tag 莽a臒谋r谋b.
Yax艧谋, OK, n蓹 var?
>> Yax艧谋 b蓹lk蓹 眉莽眉n 蓹n yax艧谋 bir b蓹d蓹n yolu il蓹 ay谋rmaq,
b蓹d蓹n web page content olan.
Bel蓹 ki, b蓹lk蓹 r蓹hb蓹ri tag m蓹hsullar谋 m眉蓹yy蓹n ki, brauzer p蓹nc蓹r蓹sind蓹 m眉vafiq deyil
lakin el蓹 vacibdir bizim web page d眉zg眉n g枚st蓹ril蓹n olunur.
M蓹s蓹l蓹n, daxili ba艧 tag biz ad谋 tags var.
>> Bel蓹 ki, ad谋 salam d眉nya olmaqla, 蓹slind蓹 n蓹 olacaq
Chrome ni艧an谋 g枚st蓹rir v蓹 ya Safari v蓹 ya Firefox-- da
n蓹 browser ki prefer-- n蓹 ad谋 g枚st蓹rm蓹k olacaq.
V蓹 ni艧anlar 蓹vv蓹l g枚st蓹rir ki, B眉t眉n brauzer p蓹nc蓹r蓹sind蓹 q蓹d蓹r
v蓹 yaln谋z bir s蓹hif蓹 ola bil蓹r Bir anda bir brauzer p蓹nc蓹r蓹sind蓹 a莽谋lacaq.
Bel蓹 ki, olacaq ni艧an谋 m蓹nim s蓹hif蓹 up ad谋
v蓹 ya brauzerinizin p蓹nc蓹r蓹 bar, hello d眉nya.
V蓹 sonra content m蓹nim web page hello, d眉nya olacaq.
Bel蓹 ki, n蓹 bir n蓹z蓹r salaq bu kimi bir 艧ey kimi g枚r眉n蓹 bil蓹r.
Bu olduqca sad蓹 HTML s蓹hif蓹.
M蓹n CS50 IDE g蓹ldim v蓹 M蓹n bir az zoomed etdik.
M蓹n yaln谋z gedir蓹m salam dot HTML a莽maq
v蓹 bu olduqca 莽ox oldu臒unu g枚st蓹rir biz 蓹vv蓹l g枚rd眉m s蓹hif蓹 content.
M蓹nim sad蓹 HTML, ba艧 tags, title tags, bel蓹 ki, b蓹d蓹n, v蓹.
M蓹n t蓹miz olmaq indented etdik.
>> M蓹n n蓹 ed蓹 bil蓹r sonra n蓹 m蓹nim IDE yaln谋z s蓹hif蓹 preview edir.
V蓹 biz getm蓹k.
m蓹nim s蓹hif蓹 content, d眉nya salam, m蓹n bir 艧ey g枚rm眉r蓹m
orada ba艧 tags edir.
Bu orqan yaln谋z content var.
D眉nya, salam.
V蓹 yen蓹 b蓹d蓹n yaln谋z dedi, d眉nya, salam.
dig蓹r hiss蓹si yoxdur.
>> Bel蓹 ki, h蓹qiq蓹t蓹n, b眉t眉n var.
Bu, 莽ox sad蓹 蓹sas HTML s蓹hif蓹.
陌ndi m蓹nim HTML girintili etdik , h蓹qiq蓹t蓹n g枚z蓹l v蓹 m眉t蓹艧蓹kkil olmaq
lakin m蓹n, h蓹qiq蓹t蓹n yoxdur.
M蓹n bunu olduqca 莽irkin baxmaq ed蓹 bil蓹r.
V蓹 bu h蓹l蓹 i艧l蓹m蓹k olard谋.
Bu eyni web page olard谋.
M蓹n yaln谋z xilas kazan谋lm谋艧 etdik a臒 kosmik b眉t眉n.
>> O 莽谋x谋r ki, a臒 kosmik m蓹lumatd谋r.
V蓹 bel蓹 ki, biz m蓹lumatlar谋n g枚nd蓹rilm蓹si etdiyiniz zaman g枚nd蓹r蓹n server, al谋c谋 眉莽眉n
m眉艧t蓹ri, data pul edir.
V蓹 bel蓹 a臒 kurtulman谋n h蓹qiq蓹t蓹n yax艧谋 bir fikirdir
茝g蓹r kims蓹 蓹g蓹r kim xidm蓹t edir web m蓹zmun bir 莽ox up.
Siz 蓹g蓹r Bu pis bir fikirdir bu m蓹hsullar谋 枚yr蓹nm蓹k kims蓹
v蓹 siz ist蓹diyiniz Bu g枚z蓹l t蓹艧kil edib.
Bu daha analiz 眉莽眉n 莽ox asand谋r.
Amma bu funksional eynidir var.
>> kimi abzas v蓹 stuff h蓹qiq蓹t蓹n HTML etm蓹z.
B眉t眉n m蓹s蓹l蓹 a莽谋lmas谋 tags v蓹 D眉zg眉n qaydada tags ba臒lanmas谋.
Baxmayaraq ki, burada n蓹 ed蓹k.
bi莽imlendirme biz蓹 眉莽眉n bir yol verir 蓹lav蓹 informasiya
biz yazd谋q n蓹 haqq谋nda.
Salam, D眉nya hiss蓹si idi ad谋 kimi 艧蓹rh.
V蓹 salam hiss蓹si d眉nya idi m蓹zmun kimi t蓹fsir
v蓹 ya n蓹 olmal谋d谋r M蓹nim web page g枚r眉n眉r.
>> Bu m眉xt蓹lif 100-d蓹n 莽ox var tags v蓹 b枚y眉k resurslar谋 莽ox
onlar谋 tapmaq 眉莽眉n online.
Biz haqq谋nda dan谋艧maq olacaq Bu video onlara ne莽蓹 b蓹zi
h蓹qiq蓹t蓹n fundamental m蓹hsullar谋.
Amma biz dan谋艧maq fikrind蓹 deyilik b眉t眉n haqq谋nda 莽眉nki
bunu tam olard谋.
>> Siz d蓹, Bunu ba艧qa bir 艧ey, geli艧tirici al蓹tl蓹ri a莽maq deyil.
V蓹 geri 蓹g蓹r HTTP bizim video,
M蓹n a莽maq 眉莽眉n nec蓹 izah geli艧tirici al蓹tl蓹ri up.
Chrome ad蓹t蓹n F12 蓹sas var geli艧tirici toolbar a莽maq 眉莽眉n.
Sonra 蓹v蓹zin蓹 Network se莽ilm蓹si ni艧an谋, siz Elements ni艧an谋 se莽蓹 bil蓹rsiniz.
V蓹 bir web y眉k 蓹g蓹r s蓹hif蓹, h蓹qiq蓹t蓹n laz谋md谋r
ki, web page yarad谋r HTML g枚r眉r眉k.
V蓹 bel蓹 ki, HTML haqq谋nda bir 莽ox 艧ey 枚yr蓹n蓹 bil蓹rsiniz sevdiyiniz saytlarda baxaraq
v蓹 onlar qurmaq nec蓹 g枚r眉b Ist蓹diyiniz ki, onlardan m眉xt蓹lif 蓹d蓹d.
Bel蓹 ki, b蓹lk蓹 bu s蓹rin var model v蓹 ya kimi bir 艧ey.
Nec蓹 HTML il蓹 ed蓹 bil蓹r蓹m?
Yax艧谋 Siz yaln谋z geli艧tirici a莽a bil蓹r ki, element 眉z蓹rind蓹 al蓹tl蓹ri v蓹 hover
v蓹 HTML edir d蓹qiq n蓹.
Bel蓹 ki, h蓹qiq蓹t蓹n var HTML 枚yr蓹nm蓹k 眉莽眉n yax艧谋 bir yoldur,
v蓹 m蓹n g眉cl眉 g蓹lir Siz h蓹m d蓹 枚yr蓹nm蓹k 眉莽眉n n蓹 HTML
v蓹 h蓹m莽inin bir az 枚yr蓹nm蓹k 眉莽眉n variantlar谋 b蓹zi bit
sizin 眉莽眉n m枚vcud geli艧tirici tools olan
蓹lb蓹tt蓹 laz谋ml谋 olacaq Siz daha intensiv web bunu ba艧lay谋r
proqramla艧d谋rma.
>> Bel蓹 ki, bir n蓹z蓹r ed蓹k 眉mumi HTML tags ne莽蓹.
V蓹 biz tullanmaq v蓹 n蓹z蓹r almaq laz谋md谋r Bu tags d蓹 g枚st蓹r蓹c蓹k n蓹
M蓹nim IDE b蓹zi fayllar谋 baxaraq kimi.
Bel蓹 ki, burada 眉莽 莽ox 蓹sas tags var M蓹tn g枚r眉n眉艧眉n眉 tweaking.
B tags, m蓹n tags v蓹 U tags var.
V蓹 m眉vafiq olaraq onlar谋n n蓹 var qal谋n onlar谋n aras谋nda m蓹tn g枚st蓹rm蓹k,
italik, v蓹 vur臒ulayaraq.
Bel蓹 ki, baxmaq n蓹 g枚rm蓹k bildirin M蓹nim IDE faktiki web page kimi.
>> Bel蓹 ki, burada m蓹nim IDE m蓹n bir BIU Sap谋n谋艧dan dot HTML adl谋 fayl.
BIU Sap谋n谋艧dan dot HTML yaln谋z olan qal谋n, italik, vur臒ulayan.
M蓹n onu a莽maq laz谋md谋r.
>> V蓹 biz burada g枚r眉rs眉n眉z Bu m蓹tn B tags qal谋n.
Bu m蓹tn M蓹n tags italik edir.
Bu m蓹tn U tags vur臒ulad谋.
Bu kimi baxmaq 眉莽眉n gedir?
Yax艧谋 daha, b眉t眉n m蓹n burada art谋q getm蓹k n蓹 etm蓹k
m蓹nim brauzerinizin, m蓹nim fayl browser bas谋n Preview v蓹 bu g蓹lir n蓹.
>> B aras谋nda m蓹tn tags h蓹qiq蓹t蓹n indi qal谋n.
I aras谋nda m蓹tn tags h蓹qiq蓹t蓹n indi italik edir.
V蓹 U aras谋nda m蓹tn tags h蓹qiq蓹t蓹n indi vur臒ulad谋.
Bel蓹 ki, olduqca yax艧谋.
Biz indi m蓹tn etm蓹k 眉莽眉n nec蓹 bir az daha x眉lya baxmaq
v蓹 ya m眉蓹yy蓹n 艧eyl蓹r diqq蓹t c蓹lb edir.
Burada 眉mumi tags bir ne莽蓹 paraqraf tags, P, v蓹 header tags,
M蓹n HX kimi burada g枚st蓹ril蓹n etdik.
>> Bu P tags, bu paraqraf tags, ci madd蓹l蓹rd蓹 sizin m蓹tn par莽alamaq.
Bu, yaln谋z kifay蓹t q蓹d蓹r deyil daxil edin v蓹 bo艧luq t蓹rk edib,
komp眉ter yaln谋z gedir, 莽眉nki Siz n蓹 etm蓹k dem蓹k n蓹
v蓹 a臒 m蓹h蓹l qoymur 莽ox hiss蓹si 眉莽眉n yer.
Bel蓹likl蓹, biz yaln谋z Enter bilm蓹z v蓹 komp眉ter g枚zl蓹yirik
Biz ist蓹yirik ki, 艧蓹rh yeni-ci b蓹nd蓹 ba艧lamaq 眉莽眉n.
Biz 莽ox a莽谋q-ayd谋n bu dem蓹k laz谋md谋r Bu paragraph-- bir ba艧qa qoyulur edir
P tags bir s谋ra h蓹r enclosing t蓹r蓹find蓹n.
>> V蓹 biz d蓹 bu variantlar谋 var H tags, bu header tags 眉莽眉n.
Biz alt谋 m眉xt蓹lif s蓹viyy蓹l蓹rd蓹 var ba艧l谋qlar谋n谋, bir, iki, 眉莽,
d枚rd, be艧 v蓹 alt谋, t蓹dric蓹n daha b枚y眉k v蓹 daha b枚y眉k
ba艧l谋qlar谋n谋.
Onlar ki莽ik almaq v蓹 ki莽ik v蓹 ki莽ik v蓹 ki莽ik.
Bel蓹 ki, biz, ikinci bir 眉st m枚vzu var s蓹viyy蓹si header, v蓹 s, v蓹 s.
>> B蓹lk蓹 b蓹zi n蓹z蓹r salaq P tags v蓹 b蓹zi header tags
bir web page f蓹aliyy蓹t.
Bel蓹 ki, burada m蓹nim IDE m蓹n adl谋 bir fayl var PH dot HTML, PH olan ci madd蓹l蓹rd蓹
v蓹 header tags.
Q蓹d蓹r a莽谋n.
Bir 莽ox burada var neler M蓹n b蓹zi Lorem qoymaq etdik, 莽眉nki
ipsum, burada b蓹zi yaln谋z t蓹sad眉fi m蓹tn.
M蓹n bir az ki莽iltm蓹k laz谋md谋r var, 莽眉nki bu q蓹d蓹r gedir.
Amma 莽ox var ki, g枚r眉rs眉n眉z , M蓹n H1, bir s蓹viyy蓹d蓹 bir burada Yuxar谋
header tag.
Sonra m蓹n yaln谋z bir paraqraf var t蓹sad眉fi text-- Lorem bir d蓹st蓹 ipsum--
yaln谋z m蓹tn standart doldurulmas谋 default.
Bel蓹 ki, daxilind蓹 iki-ci madd蓹l蓹rd蓹 var s蓹viyy蓹d蓹 bir m枚vzu v蓹 sonra a艧a臒谋 a艧a臒谋da
line 24-d蓹 burada bir s蓹viyy蓹d蓹 iki m枚vzu var, ikinci s蓹viyy蓹li header, v蓹 dig蓹r iki
ci madd蓹l蓹rd蓹.
Yax艧谋 bu kimi n蓹 baxmaq M蓹n 枚nizleme ke莽irm蓹k 蓹g蓹r?
G枚r蓹k.
>> Bel蓹 ki, qeyd Burada ilk s蓹viyy蓹li header
h蓹qiq蓹t蓹n bir q蓹d蓹r b枚y眉kd眉r 陌kinci s蓹viyy蓹li m枚vzu 莽ox.
Bel蓹likl蓹, biz H1 tags istifad蓹.
V蓹 P tags biz蓹 imkan fark ci madd蓹l蓹rd蓹 daxil 艧eyi 莽谋xmaq 眉莽眉n.
Biz bu P tags xilas kazan谋lm谋艧 olsayd谋 v蓹 faktiki olaraq yaln谋z qoymaq girir v蓹 ya Returns
Biz 眉mid n蓹 aras谋nda oldu臒u m眉xt蓹lif ci madd蓹l蓹rd蓹 ola,
onlar yaln谋z birlikd蓹 莽谋rpmaq ed蓹c蓹k v蓹 Bu g枚z蓹l-ci b蓹nd蓹 olmazd谋
yuxar谋da v蓹 a艧a臒谋da yer il蓹 ayr谋lmas谋.
V蓹 bel蓹 ki, n蓹 madd蓹 var tags v蓹 header tags
莽ox c蓹lb etm蓹k 眉莽眉n istifad蓹 olunur bizim web page hiss蓹l蓹rind蓹n diqq蓹t
ki, 艧蓹kild蓹.
>> Sonrak谋 q蓹d蓹r istifad蓹 b蓹zi tags var bizim web page siyah谋lar谋 yaratmaq 眉莽眉n.
Bel蓹likl蓹, biz unordered var lists-- ULs-- olan yaln谋z var
sifari艧 bulleted siyah谋lar谋, numbered-- var siyah谋s谋
OLs-- v蓹 daxilind蓹 v蓹 ya o biri biz laz谋md谋r
Li siyah谋da g枚st蓹rir nec蓹 d蓹stl蓹ri.
V蓹 bel蓹 ki, biz a莽谋q UL tag var v蓹 biz bunu daxilind蓹 madd蓹l蓹r qoymaq.
V蓹 sonra biz Bitirdi臒inizde ki, biz UL tag yax谋n bil蓹r.
>> V蓹 eynil蓹 biz ola bil蓹r sifari艧 v蓹 ya n枚mr蓹l蓹nmi艧 siyah谋
ki, daxilind蓹 siyah谋s谋 madd蓹l蓹r qoydu.
Bel蓹 ki, bir n蓹z蓹r salaq siyah谋lar谋 bir ne莽蓹
v蓹 n蓹 ed蓹c蓹kl蓹rini CS50 IDE kimi g枚st蓹rir.
M蓹n IDE A burada var Fayl adl谋 siyah谋lar谋 HTML n枚qt蓹.
Bir n蓹z蓹r salaq.
>> V蓹 burada bildiri艧 M蓹n bir unordered var bu be艧 艧eyi siyah谋s谋.
V蓹 sonra m蓹n bir sifari艧 siyah谋s谋 var, v蓹 M蓹n tag bir az d蓹yi艧ib etdik,
sa臒?
M蓹n start alt谋 b蓹rab蓹rdir bildirib etdik.
Bu sifari艧 siyah谋s谋 I 莽谋x谋r ba艧lan臒谋c n枚qt蓹si yerd蓹 bil蓹rsiniz
M蓹n one-- olacaq default want-- yaln谋z bu qondarma atributu 蓹lav蓹
M蓹nim OL tag.
V蓹 bu siyah谋 olacaq alt谋 hesablanmas谋 ba艧lan谋r.
Ki sayl谋 siyah谋s谋 So elementl蓹ri olmal谋d谋r alt谋, yeddi, s蓹kkiz, doqquz, on,
be艧 elementl蓹ri var, 莽眉nki Siyah谋da, bir f蓹rqli olaraq,
iki, 眉莽, d枚rd, be艧, hans谋 M蓹n OL bildirib ki, 蓹g蓹r hal olard谋
start atributu ifad蓹 olmadan.
>> Siz bel蓹 ki, biz yaln谋z bu 枚nizleme bil蓹rsiniz burada neler 眉莽眉n bir m蓹nada almaq.
V蓹 biz getm蓹k.
M蓹nim siyah谋s谋 var.
ilk be艧 elementl蓹ri unordered v蓹 ya bulleted siyah谋lar谋.
V蓹 n枚vb蓹ti be艧 elementl蓹ri ayr谋-ayr谋 sifari艧 siyah谋s谋 var
alt谋 ild蓹n ba艧lay谋r.
Ki Bel蓹 ki, nec蓹 biz HTML istifad蓹 siyah谋lar谋 qurmaq.
Ba艧qa bir 艧ey ola bil蓹r HTML il蓹 etm蓹k ist蓹yirik
bir masa qurmaq sat谋r ve s眉tun m蓹lumat
bir m蓹lumat t蓹qdim x眉susil蓹 yol t蓹艧kil edib.
Biz bir ola bil蓹r HTML Bunu etm蓹k 眉莽眉n a莽谋q bracket ba艧layan masa m眉蓹yy蓹n
masa.
V蓹 sonra masa daxilind蓹 biz sat谋rlar, TR tags bir s谋ra ola bil蓹r
h蓹r bir s谋ra g枚st蓹rir.
V蓹 sonra TD tags TR tags daxili getm蓹k bir s谋ra 蓹rzind蓹 bir s眉tun m眉蓹yy蓹n etm蓹k.
>> N蓹 眉莽眉n TD adl谋 v蓹 TC deyil?
Yax艧谋, TD masa data dayan谋r.
Ad蓹t蓹n qoyulmas谋 edirik orada m蓹lumat.
Bu TD v蓹 TC var n蓹 ki, var.
Bu bir az confusing var.
>> Bel蓹 ki, masa tags v蓹 Sizin masa tags daxilind蓹
Siz sat谋r, TRS bir s谋ra var.
V蓹 h蓹r bir s谋ra daxili var S眉tun say谋 TDS
siz ist蓹yir蓹m ki, x眉susi s谋ra.
Bir 莽ox n蓹z蓹r salaq CS50 IDE 眉z蓹rind蓹 sad蓹 masa.
>> Bel蓹 ki, burada bir fayl var masa dot HTML 莽a臒谋r谋b.
Nin n蓹z蓹r salaq n蓹 kimi g枚r眉n眉r.
Bir 莽ox burada orada ged蓹n, lakin Fark 蓹g蓹r m蓹n bir masa a莽谋q.
M蓹n masa il蓹 m眉蓹yy蓹n ba艧layan al谋ram.
V蓹 sonra m蓹nim ilk s谋rada m蓹n y蓹qin var ki, d枚rd s眉tun, bir, iki, 眉莽,
d枚rd.
V蓹 sonra m蓹n ki, s谋ra il蓹 bitirdim.
>> Sonra m蓹n ba艧qa bir s谋ra ba艧lamaq v蓹 iki, d枚rd, alt谋, s蓹kkiz yoxdur.
Ki, s谋ra bitirin.
Ba艧qa s谋ra, 眉莽, alt谋, doqquz, 12 etm蓹yin.
V蓹 sonra son sat谋r, d枚rd, s蓹kkiz, 12, v蓹 bu olsa
bir az, 16 burada k蓹sdi.
>> Hesab edir蓹m ki, s谋ra tamamlad谋.
M蓹n masa tamamlad谋.
V蓹 sonra m蓹n HTML il蓹 bitirdim.
Bu nec蓹 g枚r眉n眉r?
B蓹li, bu g枚rm蓹k h蓹qiq蓹t蓹n 莽ox deyil.
M蓹n ayd谋n m蓹nim informasiya t蓹艧kil etdik bir q蓹d蓹r daha m眉t蓹艧蓹kkil 艧蓹kild蓹.
Amma burada super olduqca deyil.
V蓹 biz il蓹 m蓹艧臒ul olacaq biz CSS haqq谋nda dan谋艧maq zaman ki.
Biz bu fikri yenid蓹n laz谋md谋r biz Masa etm蓹k 眉莽眉n n蓹
b蓹lk蓹 bir az daha yax艧谋 format?
Amma h蓹l蓹 d枚rd sat谋r var, h蓹r biri d枚rd s眉tun var,
bir edir v蓹 h蓹qiq蓹t蓹n bu m蓹bl蓹臒l蓹r n蓹 脟ox sad蓹 d枚rd d枚rd vurma t蓹r蓹find蓹n
masa.
>> Biz haqq谋nda dan谋艧maq laz谋md谋r, yaln谋z bir ne莽蓹 tags.
Haqq谋nda dan谋艧maq ed蓹k HTML forma anlay谋艧谋.
Bel蓹 ki, bu g枚rm眉艧蓹m bil蓹r bir web page daxil kontekstind蓹.
Ad蓹t蓹n siz istifad蓹莽i ad谋 yaz谋n.
Siz parol yaz谋n v蓹 siz getm蓹k iyi.
Ki, bir forma ba艧lan臒谋c谋 olacaq.
>> 脺z蓹rind蓹 atlama ikinci div.
Biz d蓹 giri艧 olan c眉r formalar谋n谋n daxilind蓹 uy臒un.
Bu elementl蓹r var ki, Siz, h蓹qiq蓹t蓹n, daxil yazaraq edirik
v蓹 ya radio d眉ym蓹l蓹ri sen ticking, v蓹 ya 莽ek
Siz off ticking edirik qutular谋.
Bel蓹 ki, bu formalar谋 daxili getm蓹k.
Onlar 蓹sas蓹n t蓹艧kil 艧蓹klind蓹 h蓹r bir sat谋r
forma yax艧谋 bi莽imlendirilmi艧 olunur.
Sonra bu anlay谋艧 var h蓹qiq蓹t蓹n ki, bir div,
h蓹r hans谋 bir kateqoriya uy臒un M蓹n var olanlar kimi tags
Daha 蓹vv蓹l bunu.
Bu, sad蓹c蓹 sort ay谋r谋r b蓹zi ixtiyari division-- ba艧lan臒谋c谋
S蓹hif蓹nin div--.
He莽 bir vizual fasil蓹 var.
He莽 bir x蓹tt var.
Bu kimi yola deyil avtomatik ayr谋 y谋臒谋n.
Siz stil var ediyorum ki, yol bunu.
>> Bu, sad蓹c蓹 sort bir ist蓹yir蓹m deyir M蓹nim web page yer par莽a,
v蓹 m蓹n yaln谋z z蓹ng etm蓹k 眉莽眉n gedir蓹m Bu m蓹nim s蓹hif蓹 bu b枚lm蓹.
Biz daxili m蓹hsullar谋 qoya bil蓹r divs v蓹 蓹slind蓹,
biz art谋q ba艧 zaman Ikinci IDE alaca臒谋q
M蓹n qoyulmas谋 al谋ram ki, g枚r蓹c蓹ksiniz m蓹nim bir div daxilind蓹 t蓹艧kil edir.
>> M蓹n IDE A burada var div formas谋 dot HTML adl谋 fayl.
Onu a莽maq ed蓹k.
Dediyim kimi bildir蓹k ki, div ixtiyari n枚v眉d眉r.
Sa臒?
Bu, h蓹qiq蓹t蓹n bir 艧ey dem蓹k deyil.
Bel蓹 ki, bir ixtiyari var m蓹nim s蓹hif蓹 ilk b枚lg眉s眉.
V蓹 sonra yerin蓹 ba艧qa bir div sonra line s蓹kkiz ba艧layan,
Bu forma var.
V蓹 forma daxilind蓹 bir var giri艧 say谋, forma alanlar.
Bel蓹 ki, onun ad谋 bir sah蓹 var A-- h蓹qiq蓹t蓹n bir 艧ey dem蓹k deyil ki,
sa臒, indi ki, y蓹qin m蓹tn, ba艧qa bir edir ki,
Radio bir parol ba艧qa edir d眉ym蓹sini bir onay qutusu var ki, ba艧qa,
v蓹 ki, ba艧qa bir d眉ym蓹sin蓹 g枚nd蓹rin.
Yax艧谋, n蓹 bu yoxdur b眉t眉n h蓹qiq蓹t蓹n kimi baxmaq?
Yax艧谋, bir n蓹z蓹r salaq.
Biz 枚nizleme p蓹nc蓹r蓹 onu a莽maq laz谋md谋r.
Bu kefi Qeyd ed蓹k ki, ilk var division--
Burada he莽 bir vizual ayr谋lmas谋.
Bu, h蓹qiq蓹t蓹n, do臒ru bir 艧ey etm蓹di?
>> V蓹 sonra m蓹nim forma var.
M蓹n h蓹r hans谋 bir x眉susi bi莽imlendirme etm蓹di.
Bel蓹 ki, forma biridir m蓹lumat b枚y眉k s谋ra.
M蓹n f蓹rqli m蓹nim formu bi莽imlendirilmi艧 olsayd谋, M蓹n x蓹tti il蓹 x蓹tti il蓹 line ola bil蓹r.
Amma h蓹r hans谋 bir 眉slubu etm蓹dim.
Yen蓹 biz burada CSS s枚hb蓹t deyilik.
Biz yaln谋z HTML haqq谋nda s枚hb蓹t edirik.
>> D蓹 m蓹nim m蓹tn 艧蓹klind蓹 I tipli bil蓹r unutmay谋n ki, n枚v眉, m蓹tn formalar谋
bel蓹 ki, m蓹n ad qoymaq olar.
V蓹 m蓹nim parol I 艧ifr蓹mi ed蓹bil蓹rsiniz.
V蓹 sah蓹sind蓹, 莽眉nki , n枚v眉 parol deyil
Siz m蓹nim parol n蓹 bilmir蓹m.
Bu, b眉t眉n n枚qt蓹l蓹r var.
>> M蓹n d蓹 bir off g蓹n蓹 se莽蓹 bil蓹rsiniz radio 'd眉ym蓹sin蓹 v蓹 ya bir onay qutusu off i艧ar蓹l蓹yin.
Ya m蓹n formada t蓹qdim ed蓹 bil蓹r.
M蓹n bir 艧ey etm蓹dim, bel蓹 ki, m蓹n 艧蓹klind蓹 t蓹qdim zaman,
s蓹hif蓹 yaln谋z yenilenir.
Amma b蓹lk蓹 konfiqurasiya ed蓹 bil蓹r m蓹nim Ba艧qa bir 艧ey d眉ym蓹sini g枚nd蓹rin.
V蓹 biz n蓹 ed蓹 n蓹 g枚r眉rs眉n眉z PHP bir g蓹l蓹c蓹k video edir.
Amma bu 莽ox qurur sad蓹 formada ki, biz
users qar艧谋l谋ql谋 眉莽眉n istifad蓹 ed蓹 bil蓹rsiniz v蓹 bizim saytda m蓹lumat t蓹qdim edir.
>> Son bir comment biz 蓹vv蓹l b蓹zi dig蓹r tags 眉莽眉n h蓹r蓹k蓹t
Bu n蓹z蓹r 眉莽眉n Giri艧 tag bir d蓹f蓹 daha.
M蓹n qeyd etdik Notice q谋rm谋z谋 tag bitir.
Biz bu g眉n蓹 q蓹d蓹r g枚rd眉m h蓹r tag var bir ba艧lan臒谋c谋 v蓹 son bir a莽谋l谋艧谋 olmu艧dur
tag v蓹 yekun tag.
>> Lakin giri艧 tag deyil.
Gedir he莽 bir m蓹tn var giri艧 tags aras谋nda.
M蓹lumat b眉t眉n biz 莽atd谋rmaq ist蓹y蓹n edirik
hiss蓹si kimi borcludur ki girdi atributlar谋.
Biz input ad谋 x b蓹rab蓹rdir ed蓹k.
Type y b蓹rab蓹rdir.
Ki, h蓹qiq蓹t蓹n, b眉t眉n m蓹lumat ehtiyac谋m谋z var.
>> Bu 枚z眉n眉 ba臒lan谋艧 tag adlan谋r.
Bu a莽谋lmas谋 v蓹 t蓹l蓹b etmir yax谋n m蓹lumat b眉t眉n 莽眉nki
daxilind蓹 olan tag v蓹 onun atributlar谋.
Bel蓹 ki, b蓹z蓹n d蓹 bu g枚r蓹c蓹ksiniz.
Bir varsa ki, yaln谋z x蓹b蓹rdar olmaq tamamil蓹 m眉stakil tag,
Bu a莽谋r v蓹 枚z眉n眉 ba臒lay谋r sol, a莽谋q bucaql谋 bracket
v蓹 莽izgi buca臒谋 sa臒 bracket.
Biz o ba艧qa bir g枚r蓹c蓹ksiniz 陌ndi image tags il蓹, el蓹c蓹 d蓹.
>> Biz images haqq谋nda dan谋艧maq 蓹vv蓹l, hiperlink haqq谋nda dan谋艧maq laz谋md谋r.
Biz ist蓹yirsinizs蓹, bizim web page olmaq interaktiv v蓹 bizi 蓹traf谋nda h蓹r蓹k蓹t,
Bu m眉mk眉n g枚z蓹l olard谋 o biri bas谋n
n蓹 ad蓹t蓹n mavi link olmu艧dur.
Bu qurmaq nec蓹 蓹slind蓹 Bizim web page bir hiperlink.
V蓹 maraql谋 kifay蓹t q蓹d蓹r ba艧qa HTML tag var
bir k枚pr眉 deyil, link 莽a臒谋r谋b.
Burada anker dayan谋r, v蓹 ki, bir k枚pr眉 g枚st蓹rir nec蓹.
>> A href x dem蓹kdir getm蓹k b蓹rab蓹rdir web page X. V蓹 h蓹r 艧ey
A tag a莽谋q aras谋nda v蓹 yax谋n bir tag
n蓹 olacaq vur臒ulay谋b bir ke莽id kimi g枚r眉n眉r mavi m蓹tn
biz tan谋艧 oldu臒unu.
A艧a臒谋da biz image tag, olan 枚z眉n眉 ke莽irm蓹k 眉莽眉n tag ba臒lay谋r
X yerl蓹艧蓹n bir resim v蓹 Siz d蓹yi艧dirm蓹k ed蓹 bil蓹r
ifad蓹 ed蓹r蓹k image eni v蓹 h眉nd眉rl眉y眉
v蓹 dig蓹r atributlar谋 da ki, dot dot var n枚qt蓹.
>> Burada 莽ox alt biz 莽ox maraql谋 var
tag axtar谋r ki deyil bir yekun tag var.
Bu nida point DOCTYPE HTML var.
Bel蓹 ki, HTML b蓹ri web pages tikinti 眉莽眉n erk蓹n 1990-c谋 ill蓹rd蓹
v蓹 m蓹ruz getdi O vaxtdan b蓹ri bir ne莽蓹 d眉z蓹li艧l蓹r.
茝n son 2014-ci ild蓹 bir t蓹fti艧 m蓹ruz
陌ndi cari olan HTML5 adl谋 de-fakto HTML standart sort.
>> G枚st蓹rir ki, bizim web pages, HTML5 istifad蓹 yaz谋lm谋艧d谋r
biz ba艧lamaq nec蓹 bu.
Bu 蓹ks oluna bil蓹r, lakin n蓹 蓹sas蓹n
dem蓹kdir tags h蓹r hans谋 bir istifad蓹 ed蓹 bil蓹rsiniz HTML5 tags, bu yeni tags ki, var.
Bel蓹likl蓹, biz h蓹mi艧蓹 ba艧lamaq biz HTML5 istifad蓹 edirsinizs蓹.
V蓹 b眉t眉n tags biz haqq谋nda s枚hb蓹t etdik 蓹vv蓹ll蓹r HTML5 tags deyil.
Amma bu g枚st蓹rir ki HTML5 tags i艧tirak ed蓹c蓹k.
V蓹 bel蓹 ki, biz nida var DOCTYPE HTML olan
莽ox ba艧谋nda bizim HTML fayl v蓹 sonra sonra point
Biz, h蓹qiq蓹t蓹n, bizim HTML a莽谋q tag v蓹 oradan davam etdirilir.
>> son bir, bir comment tag edir olan 莽ox, az f蓹rqli g枚r眉n眉r.
Bu bucaq il蓹 off ba艧lay谋r bracket nida dash
dash lakin he莽 bir ba臒lan谋艧 bracket.
Orada bu iki elementl蓹ri aras谋nda Siz 艧蓹rh yazmaq yerdir.
V蓹 艧蓹kill蓹r n蓹z蓹r ed蓹k v蓹 艧蓹rhl蓹r v蓹 CS50 IDE links.
>> M蓹n bir fayl adl谋 image link burada var M蓹n a莽maq 眉莽眉n gedir蓹m dot HTML.
M蓹n bir ne莽蓹 var ihbar M蓹nim HTML g枚r眉艧leri burada 艧蓹rh.
Bel蓹 ki, yaln谋z C v蓹 dig蓹r kimi proqramla艧d谋rma dill蓹ri,
Yaln谋z bir bi莽imlendirme dili olmaqla HTML 艧蓹rh etm蓹k imkan谋 yoxdur.
V蓹 m蓹n y蓹qin gedir蓹m Rick Astley bir 艧蓹kil yerl蓹艧dirm蓹k
haradasa bu div aras谋nda tag, bu 枚zba艧谋na b枚lm蓹.
G枚r眉n眉r ki, fayl Rick dot JPEG, yerl蓹艧蓹n olan
biz art谋q geri r蓹hb蓹rlik 蓹g蓹r ikinci 眉莽眉n fayl a臒ac,
m枚vcud bir fayl cari kataloq.
Bel蓹 ki, OK.
M蓹n bunu istinad ed蓹 bil蓹r.
>> Sonra m蓹n daxili links ola bil蓹r.
Bel蓹 ki, burada line 11-d蓹 qeyd M蓹nim href salam dot HTML edir.
Bel蓹 ki, yaln谋z dot HTML salam aiddir olan cari kataloq m枚vcuddur.
M蓹n d蓹 xarici ola bil蓹r HTTPS yaln谋z ifad蓹 ed蓹r蓹k links
M蓹n s枚hb蓹t deyil蓹m g枚st蓹rir ki, M蓹nim cari kataloq bir fayl haqq谋nda.
M蓹n m枚vcud olan bir fayl s枚hb蓹t al谋ram haradasa M蓹n internet 眉zr蓹
HTTP protokolu istifad蓹 ed蓹r蓹k t蓹l蓹b etm蓹k.
>> Bel蓹 ki, bir n蓹z蓹r salaq n蓹 Bu s蓹hif蓹ni kimi ola bil蓹r
v蓹 Rick bir 艧蓹kil 眉莽眉n haz谋r Astley ekranda g枚st蓹rm蓹k.
M蓹n bu 枚nizleme bil蓹rsiniz.
Rick Astley da var Bu ixtiyari 莽ox top
b枚lm蓹 M蓹n 眉st qoydu.
V蓹 sonra a艧a臒谋 a艧a臒谋da M蓹nim links var, sa臒?
>> M蓹n salam dot HTML 眉莽眉n bir ke莽id var.
M蓹n ki, bas谋n 蓹g蓹r, m蓹n almaq Bu s蓹hif蓹d蓹 蓹srl蓹rd蓹
biz 莽ox tan谋艧 oldu臒unu Bizim proqram 莽ox ba艧lan臒谋c谋d谋r.
M蓹n bir daha a莽谋q oldu臒unu s蓹hif蓹 pop, m蓹n 蓹g蓹r pop image link bir d蓹f蓹 daha a莽maq
M蓹n d蓹 xarici getm蓹k olar CS50 veb.
V蓹 biz laz谋md谋r see-- bir az ki莽iltm蓹k burada
biz CS50 veb n枚v g枚r蓹c蓹ksiniz bizim s蓹hif蓹 ortas谋nda 蓹laq蓹dar.
Bel蓹likl蓹, m蓹n daxili etm蓹k bacard谋 xarici link, el蓹c蓹 d蓹 ke莽id.
>> HTML il蓹 son qayda biz burada s枚hb蓹t olacaq
HTML yax艧谋 t蓹艧kil edilm蓹lidir.
C biz bir 莽ox dan谋艧d谋q 艧eyi m眉xt蓹lif sintaksis.
HTML syntax h蓹qiq蓹t蓹n tags 蓹traf谋nda d枚ner.
A莽谋q h蓹r tag qapal谋 olmal谋d谋r.
V蓹 蓹slind蓹, h蓹r tag a莽maq 蓹ks qaydada ba臒lanmal谋d谋r.
>> Bel蓹 ki, bir qal谋n tag a莽maq 蓹g蓹r, bir italik tag, v蓹 sonra bir qeyd tag
bir b眉t眉n 眉莽 etm蓹k M蓹tn x眉susi d蓹sti
Siz 蓹ks qaydada onlara yax谋n olmal谋d谋r.
Qal谋n a莽谋ld谋 Bel蓹 ki, italik, siz, qeyd
qal谋n, qeyd, maili ba臒lamaq ist蓹yirik.
Encapsulation bu c眉r n蓹dir HTML g枚z蓹l v蓹 m眉t蓹艧蓹kkil saxlay谋r.
>> C f蓹rqli olaraq, baxmayaraq ki, sintaksis s蓹hvl蓹r olmayacaq h蓹qiq蓹t蓹n b蓹lk蓹 HTML 艧ik蓹st.
Sizin HTML deyil yax艧谋 ola bil蓹r formala艧m谋艧, lakin h蓹l蓹 d蓹 i艧 olard谋.
V蓹 bel蓹 ki, bu s蓹hvl蓹r t蓹r蓹find蓹n slayd s谋ralayabilirsiniz.
Bu, h蓹qiq蓹t蓹n oyan谋q olmas谋 siz蓹 var.
B蓹z蓹n onlar u臒ursuz olacaq, lakin b蓹z蓹n siz il蓹 眉z 蓹ld蓹 ed蓹 bil蓹rsiniz.
>> Bu, h蓹qiq蓹t蓹n ola bil蓹r 莽蓹tin v蓹zif蓹, baxmayaraq ki,
Siz a莽谋lan zaman takip bir tag, siz onu ba臒lad谋,
x眉susil蓹 HTML fayllar谋 b枚y眉k v蓹 daha b枚y眉k almaq.
Siz bir yard谋m laz谋md谋r.
V蓹 online var Validator tools ki,
web n蓹z蓹r 眉莽眉n istifad蓹 ed蓹 bil蓹rsiniz s蓹hif蓹 v蓹 yax艧谋 t蓹艧kil HTML g枚rmek.
V蓹 siz m眉tl蓹q olmal谋d谋r bu n蓹z蓹r
v蓹 kimi istifad蓹 ba艧lamaq HTML il蓹 b蓹zi i艧l蓹r ba艧layacaq,
almaq, yaln谋z, bel蓹 ki, HTML yaz谋l谋 t蓹艧kili haqq谋nda b蓹zi yax艧谋 v蓹rdi艧l蓹r
yax艧谋 bir 艧蓹kild蓹 HTML v蓹 yax艧谋 stil v蓹 蓹min edilm蓹si
he莽 bir 艧ey m蓹艧臒ul deyilik ki, bir syntax error yarada bil蓹r ki,
siz bir az s蓹b蓹b olacaq yol a艧a臒谋 bir problem.
>> M蓹n Doug Lloyd edir蓹m.
Bu CS50 edir.