>> DAVEN FARNHAM: Heddiw, yr wyf i'n mynd i siarad ychydig am HTML,
Iaith Markup HyperText.
Byddwch yn gweld HTML ym mhob man y dyddiau hyn.
Yn wir, os ydych yn gwylio'r fideo mewn porwr, rydych yn
gweld HTML ar hyn o bryd.
Nid HTML yn iaith raglennu, yn hytrach, mae'n iaith markup a ddefnyddir gan
porwyr gwe i rendro tudalennau ar y rhyngrwyd.
>> Felly efallai y byddwch yn gofyn, sut yn union yn ysgrifennu tudalen ar y we yn HTML gwahanol
o ysgrifennu rhaglen mewn rhaglenni iaith fel C?
Wel, C yw iaith â llym iawn rheolau cystrawennol y mae angen ei
a luniwyd cyn y gellir ei rhedeg.
Os ydych wedi anghofio'ch erioed i gynnwys hanner colon ar ddiwedd y datganiad yn
eich cod C, eich bod yn gwybod beth rwy'n siarad am mewn perthynas â cystrawen llym.
>> Porwyr gwe, fodd bynnag, yn ychydig yn fwy maddau pan ddaw i HTML.
Hyd yn oed os nad yw eich HTML yn syntactically gywir, efallai y bydd eich tudalen yn dal i fod
harddangos gan borwr, ond y gallai Nid yw edrych fel y bwriadwyd.
Felly, mae'n well bob amser i yn dilyn y rheolau.
Y ffordd orau i gael greddf am sut y mae pethau'n gweithio yw
mynd drwy esiampl.
>> Felly, yr hyn sydd gennym yma yw sylfaenol glasbrint ar gyfer tudalen we.
Mae'n debyg y byddwch sylwi ar lawer o bethau rhwng cromfachau onglog.
Wel, y rhai yn unig tagiau.
Tags bôn gwybod i borwyr gwe hynny, hey, rhywbeth
yn dod eich ffordd.
Cofiwch, fodd bynnag, pryd bynnag y byddwch yn agor tag, mae angen i chi ei gau unwaith y byddwch yn
wneud ei ddefnyddio.
>> Felly, er enghraifft, yr wyf yn agor adran o god gyda agored
corff braced, cromfach agos.
Yna ychwanegu testun, yn yr achos hwn, mae fy dudalen we cyntaf, yna pan es i
cau'r adran hon, yr wyf yn defnyddio bron i tag union yr un fath ac eithrio y tro hwn gyda
ymlaen slaes cyn corff.
Yn gyffredinol, mae hyn yn y fformat rydych yn mynd i ddefnyddio pryd bynnag y byddwch yn agor
a chau tagiau.
Gyda'i gilydd, tag agored a thag ben cyfansoddi yr hyn a elwir yn elfen.
>> Os ydych yn edrych ar y llinell gyntaf, byddwch yn gweld pwynt ebychnod a ddilynir gan
Html DOCTYPE.
Mae hyn yn wir yn unig dweud wrth eich porwr fod y ffeil yn dudalen ar y we
ysgrifennu yn HTML.
Mae'r tag HTML yn dweud yn ei hanfod, yma hon rhywfaint o HTML.
Yna, mae gennym tag pen gyda tag teitl y tu mewn iddo.
Mae'r tag pen y gallwch feddwl amdano fel yn cynnwys cod HTML a ddaw i
y rhan fwyaf eich tudalen gwe cynnwys gwirioneddol.
>> Yn gyffredinol, i chi roi teitl eich dudalen we yma, er bod rhai
tagiau eraill a all ymddangos yma hefyd.
Nesaf daw corff eich tudalen we, mae'r cig ac esgyrn gwirioneddol eich gwefan.
Yn ein enghraifft, rydym wedi dim ond rhoi syml dedfryd, Fy Tudalen We gyntaf,
a fydd, os rydym yn cynnal ein safle, yn edrych rhywbeth bach fel hyn.
Nid yw ein tudalen ar y we yn rhy queer, ond peidiwch â phoeni.
Byddwn yn sbriws i fyny yn fuan.
>> Felly, y HTML uchod, byddwn yn rhoi i chi yn iawn templed sylfaenol ar gyfer tudalen we,
dim byd ffansi, dim ond y esgyrn noeth.
Ond os ydw i'n creu tudalen ar y we, beth os wyf am ychwanegu
llun o, dyweder, fy hun?
Wel, gallaf wneud hynny.
Mae cwpl o ffyrdd i ychwanegu delweddau at eich safle.
Os yw'r ddelwedd yn yr un ffolder eich ffeil HTML, gallwch gysylltu â'r
delwedd trwy'r llwybr fel hyn.
>> I chi agor i fyny gyda thag delwedd dilyn gan yn Alt priodoledd yn y
ffynhonnell y ddelwedd.
Gwerth y priodoledd Alt yn ddim ond rhai testun amgen rhag ofn defnyddiwr na all
gweld y llun.
Fel arall, gallwch hefyd gysylltu â delweddau trwy URL llawn, fel hyn.
Nawr, nid y wefan honno ddim yn bodoli, ond os oedd darlun o
mi yn y cyfeiriad hwnnw, gallwn ei ddefnyddio yr URL ffynhonnell i gynnwys
ei ddelwedd ar fy ngwefan.
Naill ffordd neu'r llall, byddwch yn y diwedd gyda llawer gwefan prettier, rhywbeth fel hyn.
>> Wel, dyna 'n bert oera, ond yr wyf yn fath o eisiau rhywfaint o destun yma hefyd.
Felly, gadewch i ni ychwanegu rhywbeth super syml uwchben y
delwedd, fel y pennawd.
Y cyfan yr wyf wedi ei wneud hyd yn hyn yw defnyddio'r pennawd tag, H1, a thoriad llinell tag, br.
Mae'r tag pennawd yn gwneud y ffont ychydig ychydig yn fwy ac yn fwy amlwg.
Mae'r tag toriad llinell, ar y llaw arall llaw, yn fath o oer.
Wahanol i'r rhan fwyaf tagiau eraill, nad oes gennych tag agor a chau egwyl, dim ond
yr un a ddangosir uchod.
Mae hyn oherwydd toriad gan unrhyw gynnwys ac felly, elfen wag.
>> Elfennau gwag fel hyn, gallwch agor ac yn agos ar yr un pryd dim ond drwy
gan gynnwys slaes ymlaen ar y ddiwedd y datganiad cychwynnol.
Felly nawr fy ngwefan yn edrych ychydig yn rhywbeth fel hyn.
Well, ond mae'n fath o teimlo fel diwedd marw.
Does unman arall i fynd o'r neilltu o'r brif dudalen.
Wel, gadewch i ni atgyweiria bod gan gan gynnwys cyswllt.
>> Yr hyn yr wyf i'n mynd i wneud yma yn defnyddio priodoli a ddynodir gan A a gwneud y
delwedd dolen i, gadewch i ni ddweud, CS50 teledu.
Y ffordd honno, pryd bynnag unrhyw un yn clicio ar mi, Bydd eu porwr cael eu cyfeirio at
arall, yn ôl pob tebyg yn fwy ddefnyddiol, tudalen we.
Rwyf wedi cael i leihau maint y neges destun ychydig oherwydd bod ein tudalen ar y we yn
mynd yn fwy datblygedig.
Ond gobeithio, mae'n dal i fod yn glir.
Mae fy gwefan yn edrych yn union yr un fath yn unig yn awr, pryd bynnag yr wyf yn cliciwch ar y llun,
bydd fy porwr yn agor i fyny arall tab ar gyfer y dudalen we CS50.tv.
>> Yn olaf, gadewch i ni ddweud fy mod i'n mynd i arddull y wefan hon yn ddiweddarach gan ddefnyddio CSS.
CSS yw'r hyn a elwir yn dalen arddull rhaeadrol.
Ac yn y bôn yn rhoi effeithlon ffordd i olygu ac arddull
blociau tebyg o god.
Yr wyf am ddechrau trefnu fy HTML i ei gwneud yn haws i arddull ddiweddarach.
Yma, yr wyf yn sefydlu dau fath gwahanol o dynodwyr i helpu i drefnu fy cod.
Rwyf wedi defnyddio'r briodoledd ID y tu mewn i rhannu, neu tag div, ac yr wyf wedi defnyddio
Dosbarth yn priodoli y tu mewn tag div arall.
>> ID a Dosbarth priodoleddau yn gweithio yn yr un modd.
Yr unig wahaniaeth yw y gallwch chi dim ond un elfen, mae'r ID penodol, ond
unrhyw nifer o elfennau Gall rhannu dosbarth.
Felly, er enghraifft, gallaf ddefnyddio'r dosbarth delwedd sawl gwaith, ond ni allaf
creu rhaniad arall gyda'r top adnabod.
Er nad wyf wedi mynd i mewn i CSS, iaith arall a ddefnyddir yn gyffredin
ochr yn ochr â HTML, unwaith y byddaf yn dechrau steilio fy cod gyda CSS, gallaf ddefnyddio'r rhain
nodweddion sefydliadol i ddylanwadu estheteg fy dudalen gwe.
>> Mae popeth o fewn y brig adran Bydd yn rhaid i stylings tebyg neu unrhyw
grŵp arall y grŵp yr wyf yn HTML i mewn i'r Bydd delwedd dosbarth rhannu golwg tebyg.
Mae hyn yn llawer haws na cheisio i olygu a delweddau arddull neu flociau o
testun yn unigol.
>> Felly aethom dros y pethau sylfaenol o sut y i wneud dudalen we gyda HTML.
HTML Mae criw o nodweddion eraill hefyd pan paru gyda ieithoedd eraill
fel CSS a JavaScript, gall mewn gwirionedd gwneud tudalennau sefyll allan.
Y ffordd orau i gael gyfforddus gyda HTML yn unig i llanast o gwmpas gyda hi,
weld beth sy'n gweithio, a beth nad yw'n gweithio.
>> Fy enw i yw Daven Farnham.
Mae hyn yn CS50.
>> Felly, er enghraifft, gall yr wyf yn defnyddio y ddelwedd dosbarth -
Nac oes, mae cymaint o nodweddion.
Fy enw i yw Daven Farnham.
Mae hyn yn CS 650.
Wyf am ei ddweud CSS.
Mae hyn yn CSS.