>> [Muzika]
>> DOUG Lloyd: Pra, le tĂ« marrin njĂ« tĂ« tillĂ« mĂ« shumĂ« Video pĂ«r tĂ« folur pĂ«r njĂ« gjuhĂ« mĂ« shumĂ«.
KĂ«tĂ« herĂ« ne do tĂ« flasim pĂ«r CSS.
Pra CSS, e cila Ă«shtĂ« e shkurtĂ«r pĂ«r Cascading Style Sheets,
Ă«shtĂ« njĂ« gjuhĂ« qĂ« ne pĂ«rdorim kur ndĂ«rtimin e faqet e internetit.
Mendoni pĂ«r kĂ«tĂ« si kjo.
Nqs HTML Ă«shtĂ« ajo qĂ« ne pĂ«rdorim pĂ«r tĂ« organizojĂ« PĂ«rmbajtja ne duam tĂ« vĂ«nĂ« nĂ« faqen tonĂ«,
CSS Ă«shtĂ« mjet qĂ« ne nĂ« pĂ«rgjithĂ«si pĂ«rdorin pĂ«r tĂ« rregulloje se si duken faqet tona,
dhe se si user experience me tĂ« vĂ«rtetĂ« Ă«shtĂ«, qĂ« ndĂ«rveprojnĂ« me faqen tonĂ« tĂ« internetit.
>> NgjashĂ«m me HTML, CSS Ă«shtĂ« jo njĂ« gjuhĂ« programimi.
Kjo nuk ka logjikĂ«.
Ajo nuk ka variablave.
Ajo nuk ka asnjĂ« lloj qĂ« rrjedhin gjĂ«rat qĂ« lidhen se C bĂ«n.
Ă‹shtĂ« njĂ« gjuhĂ« styling.
Dhe sintaksa e tij Ă«shtĂ« shumĂ« e tĂ« thjeshtĂ«, dhe vetĂ«m pĂ«rshkruan
si elementet e tonĂ« faqe kanĂ« HTML caktuar
elemente duhet tĂ« modifikohet.
PĂ«r kĂ«tĂ« qĂ«llim, nĂ« qoftĂ« se ju nuk e keni por shikuar video tonĂ« nĂ« HTML,
ose janĂ« tĂ« panjohur me HTML nĂ« pĂ«rgjithĂ«si, ju
mund tĂ« dĂ«shironi tĂ« hidhni njĂ« sy nĂ« atĂ« sĂ« pari, pĂ«r shkak se ky diskutim tĂ« CSS
do tĂ« varet nga disa njohuri tĂ« HTML.
>> KĂ«shtu qĂ« kĂ«tu Ă«shtĂ« njĂ« tĂ« vĂ«rtetĂ« thjeshtĂ« stylesheet CSS.
Edhe nĂ« qoftĂ« se ju kurrĂ« nuk kam programuar me CSS para,
UnĂ« jam goxha i sigurt qĂ« ju mund tĂ« kuptoj se pikĂ«risht ajo qĂ« e bĂ«n kĂ«tĂ« stylesheet.
Ă‡farĂ« do tĂ« bĂ«ni?
E pra, aplikuar nĂ« trupin e faqen tonĂ« faqe, Ă§do gjĂ« nĂ« mes tags trupit
nĂ« HTML tonĂ«, dhe ajo pĂ«rcakton ngjyrĂ«n e sfondit e kĂ«saj faqe nĂ« blu.
E pra, kjo Ă«shtĂ« njĂ« stylesheet shumĂ« e thjeshtĂ«.
Ă‹shtĂ« nĂ« fakt shumĂ« e njeriut gjuha miqĂ«sore, CSS.
Pra, edhe nĂ« qoftĂ« se ju nuk e kam pĂ«rdorur atĂ« mĂ« parĂ«, ju ndoshta mund tĂ« me mend se Ă§farĂ« ajo e bĂ«ri.
NĂ« fakt, nĂ« qoftĂ« se ne tĂ« ngarkuar njĂ« faqe, ku kjo stylesheet ishte ngulitur disi,
ngjyra e sfondit tĂ« faqes tonĂ« do tĂ« tĂ« jetĂ« blu, dhe jo standarde tĂ« bardhĂ«.
>> Pra, si nuk kemi ndĂ«rtuar stili?
E pra sĂ« pari, ne duhet tĂ« identifikojnĂ« njĂ« pĂ«rzgjedhĂ«s.
NĂ« shembullin e fundit, se pĂ«rzgjedhĂ«s ishte trupi.
Pastaj ne kemi njĂ« tĂ« hapur mbajtĂ«se kaĂ§urrel, dhe ne jemi
do tĂ« fillojĂ« pĂ«rcaktimi i stylesheet pĂ«r kĂ«tĂ« pĂ«rzgjedhĂ«s.
NĂ« mes tĂ« formatimin e teksteve kaĂ§urrel, ne vetĂ«m tĂ« ketĂ« njĂ« listĂ« tĂ« Ă§ifte tĂ« rĂ«ndĂ«sishme me vlerĂ«.
Dyshja Vlera e mĂ«parshĂ«m ishte ngjyrĂ«n e sfondit pikĂ«presje blu,
por ne mund tĂ« bĂ«jmĂ« mĂ« shumĂ« dhe mĂ« shumĂ« prej tyre.
Ju mund tĂ« keni gjĂ«ra tĂ« shumta tĂ« aplikoni pĂ«r kĂ«tĂ« tag, atij organi pĂ«rzgjedhĂ«s.
Secili prej tyre Ă«shtĂ« e ndarĂ« nga a pikĂ«presje, dhe ne e quajmĂ« secili prej tyre
njĂ« deklaratĂ«, njĂ« deklaratĂ« CSS.
Kur ne jemi duke bĂ«rĂ« me tĂ« gjitha styling ne e duan tĂ« aplikojnĂ« pĂ«r kĂ«tĂ« tag tĂ« veĂ§antĂ«,
ne vetĂ«m duhet njĂ« kaĂ§urrel mbylljes shtrĂ«ngoj pĂ«r t'i dhĂ«nĂ« fund stylesheet,
dhe ne jemi duke bĂ«rĂ« pĂ«rcaktimin e stylesheet pĂ«r kĂ«tĂ« pĂ«rzgjedhĂ«s tĂ« veĂ§antĂ«.
>> Cilat janĂ« disa prona tĂ« pĂ«rbashkĂ«ta CSS?
E pra, ndoshta ju doni tĂ« vendosni njĂ« kufi rreth diĂ§kaje.
KĂ«shtu qĂ« ju mund tĂ« thoni, kufirit, qĂ« do tĂ« jetĂ« Ă§elĂ«si yt,
dhe pastaj vlerat e tua do tĂ« jetĂ«, Ă§farĂ« stil, ngjyra, dhe gjerĂ«si
ju doni qĂ« ajo tĂ« jetĂ«.
Pra, stili mund tĂ« jetĂ« njĂ« tĂ« ngurta line, njĂ« vijĂ« me pika, njĂ« linjĂ« thye,
njĂ« linjĂ« kurriz, e cila do tĂ« jetĂ« linjĂ« me onde.
Ndoshta ju doni tĂ« keni atĂ« tĂ« jenĂ« blu ose tĂ« zezĂ« apo tĂ« gjelbĂ«r.
Ndoshta ju dĂ«shironi qĂ« ajo tĂ« jetĂ« 1 ose 2 ose 10 gjerĂ« piksel.
Ju mund tĂ« specifikoni tĂ« gjitha ato gjĂ«ra.
Ndoshta ju doni tĂ« vendosur nĂ« sfond ngjyra e faqen tuaj nĂ« njĂ« mĂ«nyrĂ« tĂ« veĂ§antĂ«.
Ne tashmĂ« e pamĂ« se, vendosjen e sfond i trupit tĂ« jetĂ« blu.
>> AtĂ«herĂ« ju mund tĂ« pĂ«rdorni njĂ« fjalĂ« kyĂ§e, kĂ«shtu CSS ka ngjyra tĂ« caktuara
qĂ« janĂ« ndĂ«rtuar nĂ« tĂ«, blu, jeshile, e zezĂ«, njĂ« ngjyra shumĂ« tĂ« thjeshtĂ« qĂ« dinĂ«.
Por ju gjithashtu mund tĂ« specifikoni ndonjĂ« ngjyra magji qĂ« ju dĂ«shironi.
KujtojnĂ« se ngjyra mund tĂ« identifikohet nga njĂ« grup i tre numra magji
nga 0 deri ne 255, dhe unaza B, kuqe, jeshile, blu dhe komponent.
Dhe kĂ«shtu qĂ« ne mund tĂ« specifikojĂ« Ă§do ngjyrĂ« duam nga,
nĂ« vend tĂ« pĂ«rdorimit blu apo tĂ« gjelbĂ«r apo tĂ« zi, duke pĂ«rdorur kile dhe pastaj gjashtĂ« shifrat e magji,
dhe qĂ« do tĂ« na japĂ« gjashtĂ« shifra ngjyra.
Pra, kjo Ă«shtĂ« ngjyra e sfondit.
>> Ne gjithashtu kemi plan tĂ« parĂ« ngjyra, e cila Ă«shtĂ« zakonisht
do tĂ« jetĂ« teksti i faqes tuaj.
Dhe ju mund tĂ« bĂ«ni nĂ« mĂ«nyrĂ« tĂ« ngjashme qĂ« me fjalĂ« kyĂ§e dhe ose gjashtĂ« shifror magji.
KĂ«shtu qĂ« ju mund tĂ« specifikoni ndonjĂ« ngjyrĂ« qĂ« ju duan pĂ«r tekstin e faqes tuaj
kundĂ«r njĂ« tĂ« veĂ§antĂ« ngjyra e sfondit, lart.
Ju gjithashtu mund tĂ« ndryshojĂ« dhe tĂ« merren me font, dhe teksti mĂ«nyrĂ«
Ă«shtĂ« dhĂ«nĂ« nĂ« faqe.
>> KĂ«shtu qĂ« ju mund tĂ« ndryshojĂ« madhĂ«sinĂ« e shkronjave tuaj.
Ju mund tĂ« pĂ«rdorni fjalĂ« kyĂ§e, tĂ« tilla si ekstra, shtesĂ« tĂ« vogĂ«l, apo tĂ« xx tĂ« vogla, apo tĂ« mesme,
tĂ« mĂ«dha, dhe kĂ«shtu me radhĂ«.
Ju mund tĂ« pĂ«rdorni pikĂ« fikse, 10 pikĂ«, 12 pikĂ«, dhe kĂ«shtu me radhĂ«.
Ju mund tĂ« pĂ«rdorni pĂ«rqindjet, 80%, 20%, ku 100% Ă«shtĂ« font i parazgjedhur
madhĂ«sia, e cila zakonisht do tĂ« tĂ« jetĂ« diĂ§ka si 11 apo 12 pikĂ«.
Ose ju mund edhe tĂ« bazojnĂ« atĂ« e madhĂ«sisĂ« mĂ« tĂ« fundit font.
NĂ« qoftĂ« se ju vetĂ«m tĂ« shkruar diĂ§ka dhe ju e dini ajo qĂ« ju dĂ«shironi Ă«shtĂ« qĂ« ajo tĂ« jetĂ« mĂ« i vogĂ«l,
por ju nuk e dini saktĂ«sisht se Ă§farĂ« MadhĂ«sia ju duan qĂ« ajo tĂ« jetĂ«, mirĂ«, ju mund tĂ« them vetĂ«m,
font size tĂ« vogla.
Dhe kjo do tĂ« bazojĂ« jashtĂ« e, vetĂ«m lart, kjo Ă«shtĂ« madhĂ«sia e shkronjave.
Dhe ju mund tĂ« merrni mĂ« tĂ« vogla ose mĂ« tĂ« mĂ«dha.
Pra, ka njĂ« shumĂ« tĂ« ndryshme mĂ«nyra pĂ«r tĂ« specifikojĂ« madhĂ«sinĂ« e shkronjave.
>> Ju gjithashtu mund tĂ« specifikojĂ« se Ă§farĂ« Familja font qĂ« ju dĂ«shironi.
NĂ«se keni njĂ« tĂ« veĂ§antĂ« emri, ka njĂ« mĂ«nyrĂ« nĂ« CSS--
ne nuk jemi duke shkuar pĂ«r tĂ« folur nĂ« lidhje me tĂ« here-- pĂ«r tĂ« pĂ«rcaktuar njĂ« font shumĂ« tĂ« veĂ§antĂ«
dhe embed atĂ« nĂ« faqen tuaj.
Ju gjithashtu mund tĂ« pĂ«rdorni emra tĂ« pĂ«rgjithshme.
Nuk Ă«shtĂ« njĂ« shumĂ« e web fonts sigurta qĂ« janĂ« tĂ« para-pĂ«rcaktuar nĂ« CSS.
Dhe nĂ« qoftĂ« se ju jeni njĂ« pĂ«rdorues tĂ« Microsoft Zyra nĂ« 20 vitet e fundit,
ju ndoshta jeni njohur me njĂ« shumĂ« prej kĂ«tyre web fonts sigurta
tashmĂ«, Times New Roman, Arial, Courier New, GjeorgjinĂ«, Tahoma, Verdana,
dhe kĂ«shtu me radhĂ«.
Ata janĂ« konsideruar tĂ« gjitha web fonts sigurta.
Dhe nĂ« fakt, pjesĂ« e arsye ata erdhĂ«n nĂ« jetĂ«
Ă«shtĂ« pĂ«r t'u pĂ«rdorur pĂ«r tĂ« bĂ«rĂ« web-- Ă§do faqe kishin qasje nĂ« kĂ«tĂ« mungesĂ« tĂ« vendosur e fonts
me serifs tĂ« ndryshme, dhe e gjithĂ« kjo sende font ne nuk do tĂ« marrĂ« nĂ«,
por kĂ«to janĂ« zakonisht qasshme nĂ« CSS tuaj,
edhe nĂ« qoftĂ« se ju nuk e bĂ«ni pĂ«rndryshe definojnĂ« fonts.
SĂ« fundi, ju mund tĂ« lidhur tekstin tuaj, nĂ« vend tĂ« tij tĂ« qenit, by default, njĂ« linjĂ«
tĂ« majtĂ«, ju mund tĂ« lidhur atĂ« nĂ« tĂ« djathtĂ«,
ose ju mund tĂ« lidhur atĂ« nĂ« qendĂ«r, ose justifikohet nĂ« mĂ«nyrĂ« qĂ« ajo goditi dy kufijtĂ«.
Pra, ato janĂ« tĂ« gjitha opsionet qĂ« ju mund tĂ« pĂ«rdorni pĂ«r tĂ« ndryshuar atĂ« qĂ« tekstin tuaj si duket,
dhe se si Ă«shtĂ« shfaqur nĂ« faqen tuaj.
>> Selectors tu nuk duhet tĂ« jetĂ« vetĂ«m tags.
Ne mĂ« parĂ« pamĂ« njĂ« tag trupit pĂ«rzgjedhĂ«s, dhe tag pĂ«rzgjedhĂ«s
nuk duket vetĂ«m si kjo.
Ju emrin njĂ« tag, dhe pastaj ju tĂ« pĂ«rcaktojĂ« njĂ« stylesheet pĂ«r kĂ«tĂ« tag.
Por ju mund tĂ« bĂ«ni diĂ§ka quhet pĂ«rzgjedhĂ«s ID.
NjĂ« pĂ«rzgjedhĂ«s ID duket goxha i ngjashĂ«m.
Por vini re, se tani unĂ« nuk jam duke pĂ«rdorur njĂ« tag HTML, unĂ« jam duke pĂ«rdorur, nĂ« kĂ«tĂ« rast,
#unique, ose tĂ« hash unik.
NĂ«se ju kujtohet nga tonĂ« video mbi HTML, kemi biseduar
pĂ«r mĂ«nyrĂ«n se si tags mund tĂ« ketĂ« atributet.
>> Dhe njĂ« atribut qĂ« vlen pĂ«r shumĂ« e shumĂ« tĂ« gjithĂ« tags HTML,
por ne nuk flasim pĂ«r kĂ«tĂ«, Ă«shtĂ« diĂ§ka qĂ« quhet njĂ« tag ID.
Pra, kjo CSS veĂ§antĂ« do zbatohen vetĂ«m pĂ«r HTML tag qĂ« ka
njĂ« ID shumĂ« specifike, qĂ« e keni emrin.
Pra, nĂ«se ju keni diku nĂ« kodin tuaj, diku
nĂ« dosjen tuaj HTML, njĂ« tag dhe jush specifikoni si njĂ« atribut pĂ«r kĂ«tĂ« tag,
ID e barabartĂ« unike, kjo stylesheet tĂ« veĂ§antĂ«
kĂ«tu do tĂ« zbatohen vetĂ«m nĂ« mes qĂ« tag me ID e unik.
>> Ju gjithashtu mund tĂ« bĂ«ni diĂ§ka quajtur njĂ« pĂ«rzgjedhĂ«s klasĂ«.
Pra, pĂ«rveĂ§ qĂ« ka ID atributet, ju gjithashtu mund tĂ«
shtoni njĂ« atribut tĂ« klasit tĂ« HTML tags.
Dhe kur ju pĂ«rdorni njĂ« atribut tĂ« klasĂ«s, ajo mund tĂ« aplikohet nĂ« tags shumta.
Pra, nĂ«se ju keni disa gjĂ«ra qĂ« janĂ« tĂ« ngjashme, ndoshta ju doni tĂ« thoni,
tag hapur llafe, llafe, llafe, llafe, klasĂ« Ă«shtĂ« e barabartĂ« me studentĂ«t.
Dhe pastaj kjo tĂ« veĂ§antĂ« stylesheet do tĂ« zbatohet
pĂ«r Ă§do tag klasĂ« tĂ« cilit Ă«shtĂ« nxĂ«nĂ«s.
NĂ« kĂ«tĂ« rast, ne do tĂ« vendosur background tĂ« verdhĂ«,
dhe ne do tĂ« vĂ«nĂ« perde, e cila Ă«shtĂ« njĂ« tag ne nuk flasim pĂ«r,
por vetĂ«m merret me sa transparente diĂ§ka Ă«shtĂ«, nĂ« 70%, nĂ« kĂ«tĂ« rast.
>> Ka dy opsione pĂ«r shkrim Stylesheets.
Ju mund tĂ« shkruani ato direkt nĂ« HTML tuaj
duke e vendosur stili nĂ« mes tags stil.
Dhe kĂ«to tags stil tĂ« shkojnĂ« nĂ« brendĂ«si tĂ« tags kreu i faqes tuaj web.
MĂ«nyra ndoshta mĂ« e preferuar pĂ«r tĂ« bĂ«rĂ« kjo Ă«shtĂ« pĂ«r tĂ« shkruar njĂ« skedar tĂ« veĂ§antĂ« .css,
dhe pastaj tĂ« lidhĂ« atĂ« nĂ« tuaj dokumentuar pĂ«rdorur lidhjen tags.
Link tags, pĂ«rsĂ«ri, janĂ« ndryshĂ«m nga hyperlinks,
nĂ«se ju kujtohet nga video tonĂ« njĂ« HTML.
Dhe lidhje tags janĂ« si ne tĂ«rheq nĂ« dosje tĂ« veĂ§anta.
Ajo lloj si ekuivalentin e # Include pĂ«r programimin e web.
>> Pra, le tĂ« marrin njĂ« vĂ«shtrim nĂ« table.HTML.
NĂ«se ju kujtohet nga tonĂ« HTML Video, unĂ« tregoi
njĂ« shembull i njĂ« shumĂ« shumĂ«zimit tĂ« thjeshtĂ«
tabela qĂ« dukej goxha shĂ«mtuar, dhe ndoshta nuk ka
njĂ« mĂ«nyrĂ« pĂ«r ta bĂ«rĂ« atĂ« mĂ« mirĂ« me CSS, pĂ«r ta bĂ«rĂ« atĂ« nĂ« fakt duken
mĂ« shumĂ« si njĂ« shumĂ«zim tavolinĂ«, apo diĂ§ka
qĂ« nuk Ă«shtĂ« e mbĂ«rthyer vetĂ«m sĂ« bashku pa ndarje aktuale
mes rreshtave dhe kolonave.
Pra, le tĂ« kryesojĂ« mbi tĂ« CS50 IDE, dhe tĂ« marrĂ« njĂ« sy
se si mund tĂ« CSS, lloj, shkulje ajo qĂ« kemi filluar me para,
dhe tĂ« bĂ«jnĂ« diĂ§ka shumĂ« mĂ« mirĂ«.
>> Pra, ne jemi nĂ« CS50 IDE tani, dhe nĂ«se tĂ« panjohura,
ne do tĂ« tĂ«rheqĂ« deri nĂ« kĂ«tĂ« tabela qĂ« faqe HTML.
Table.HTML thelb vetĂ«m pĂ«rcakton pĂ«rmbajtjen
e njĂ« multiple-- ajo Ă«shtĂ« dashur tĂ« jetĂ« njĂ« tavolinĂ« katĂ«r nga katĂ«r shumĂ«zimit.
Ă‹shtĂ« shumĂ« i thjeshtĂ«.
Dhe ne do tĂ« mendojnĂ« se ajo do tĂ« shikoni tĂ« organizuar mjaft mirĂ«.
Por nĂ« fakt, kur ne preview kĂ«tĂ« faqe, ne shohim se kjo Ă«shtĂ« lloj i shĂ«mtuar, e drejtĂ«?
Ă‹shtĂ« e qartĂ« se ne kemi rreshtave dhe kolonave kĂ«tu.
Ka disa lloj ndarje.
Por kjo nuk Ă«shtĂ« njĂ« ndarje kuptimplotĂ«.
Ne nuk jemi tĂ« vĂ«rtetĂ« duke marrĂ« shumĂ« informacion kĂ«tu.
Dhe nuk ka asnjĂ« ndarje midis rreshtave dhe kolonave nĂ« aspektin
e rregullave horizontale ose vertikale.
Ne ndoshta mund tĂ« bĂ«jĂ« kĂ«tĂ« shikoni pak mĂ« mirĂ«.
Pra, le tĂ« pĂ«rpiqemi.
KĂ«shtu qĂ« unĂ« jam duke shkuar pĂ«r tĂ« mbyllur kĂ«tĂ« skedĂ« kĂ«tu.
Dhe unĂ« jam duke shkuar pĂ«r tĂ« mbyllur table.HTML tim, dhe unĂ« kam njĂ« version tjetĂ«r kĂ«tu
quajtur table2.HTML.
Ne do tĂ« hapur atĂ« deri.
Trupi i faqe Ă«shtĂ« shumĂ« e shumĂ« tĂ« njĂ«jtĂ«n gjĂ«,
por unĂ« kam ndryshuar njĂ« pak nĂ« krye.
Dhe unĂ« do tĂ« lĂ«viz deri kĂ«tu.
Vini re se kĂ«tĂ« herĂ«, unĂ« jam duke pĂ«rdorur tags stil ngulitur.
UnĂ« e kam hapur njĂ« tag stil, dhe unĂ« jam tani pĂ«rcaktimin e njĂ« stylesheet CSS vetĂ«m brenda
e saj.
UnĂ« kam njĂ« stylesheet qĂ« thotĂ«, tryezĂ«.
Kjo Ă«shtĂ« pĂ«rzgjedhĂ«s ime tag.
UnĂ« nuk jam duke pĂ«rdorur dot apo hash, qĂ« unĂ« do tĂ« jetĂ« bĂ«rĂ« nĂ« qoftĂ« se unĂ«
ishte pĂ«rdorur njĂ« ID ose njĂ« pĂ«rzgjedhĂ«s tĂ« klasĂ«s.
UnĂ« kam njĂ« pĂ«rzgjedhĂ«s tag tavolinĂ« here--.
Ky stil do tĂ« vlejnĂ« pĂ«r Ă§do tag tavolinĂ«.
Me sa duket unĂ« dua tĂ« vĂ«nĂ« njĂ« tĂ« piksel, kufiri ngurta blu,
brenda tryezĂ«n time.
Kjo tingĂ«llon si ajo ndoshta do tĂ« ndihmuar situatĂ«n, e drejtĂ«?
Ne do tĂ« kemi gjĂ«rat duken shumĂ« mĂ« mirĂ«.
Pra, kjo Ă«shtĂ« e mirĂ«.
Stilistikisht, unĂ« kam vetĂ«m ngulitur stylesheet tim kĂ«tu.
Kjo Ă«shtĂ« sigurisht njĂ« mĂ«nyrĂ« e pranueshme pĂ«r tĂ« bĂ«rĂ« atĂ«.
Le tĂ« shohim se Ă§farĂ« kjo duket si.
KĂ«shtu qĂ« unĂ« do tĂ« shkoj pĂ«rsĂ«ri poshtĂ« kĂ«tu, dhe UnĂ« do tĂ« do tĂ« parapamje table2.HTML time.
E pra, kjo nuk Ă«shtĂ« krejt ajo qĂ« kam kĂ«rkuar, por kjo Ă«shtĂ« pikĂ«risht ajo qĂ« ne kĂ«rkuam.
Ne thamĂ« se ky stil Ă«shtĂ« do tĂ« zbatohet pĂ«r tryezĂ«n tonĂ«.
Tabela jonĂ« tani ka njĂ« njĂ« pixel gjerĂ«, kufiri ngurta blu rreth tij.
Ne nuk jemi tĂ« vĂ«rtetĂ« duke marrĂ« nĂ« qelizat tryezĂ«.
Ne jemi vetĂ«m duke marrĂ« nĂ« tryezĂ«.
Pra, CSS punuar.
Ajo ka aplikuar njĂ« stylesheet nĂ« tryezĂ«n tonĂ«.
Por nuk e ka fare tĂ« bĂ«jĂ« atĂ« qĂ« kemi dashur qĂ« ajo tĂ« bĂ«jĂ«.
Si nuk kemi marrĂ« pĂ«r tĂ« bĂ«rĂ« ajo qĂ« ne duam qĂ« ajo tĂ« bĂ«jĂ«?
>> E pra, le tĂ« marrin njĂ« vĂ«shtrim nĂ« njĂ« mĂ« shumĂ« version i kĂ«tij nĂ« table3.HTML.
KĂ«shtu qĂ« unĂ« jam vetĂ«m duke shkuar pĂ«r tĂ« mbyllur kĂ«to tabs.
UnĂ« jam duke shkuar pĂ«r tĂ« shkuar mbrapa mbi kĂ«tu pĂ«r tim fotografi pemĂ«, dhe e hapur deri table3.HTML.
PĂ«rsĂ«ri, ajo do tĂ« duken bukur ngjashme kĂ«tu nĂ« fillim.
Por njoftim, kĂ«tĂ« herĂ«, nĂ« vend tĂ« pĂ«rdorimit njĂ« stylesheet ngulitur drejtĂ« nĂ« atje,
UnĂ« jam duke shkuar pĂ«r tĂ« lidhur nĂ« njĂ« stylesheet duke pĂ«rdorur tag link.
KĂ«shtu qĂ« unĂ« jam me sa duket i lidhur nĂ« njĂ« stylesheet quajtur tables.CSS,
dhe kjo mirĂ« Ă«shtĂ« e barabartĂ« me stylesheet vetĂ«m means-- mirĂ«,
Ă§farĂ« Ă«shtĂ« kjo skedĂ« nĂ« lidhje me Ă§farĂ« UnĂ« jam doing-- Ă«shtĂ« njĂ« stylesheet qĂ« unĂ« jam
duke pĂ«rdorur pĂ«r faqen time.
Pra, nĂ«se unĂ« me tĂ« vĂ«rtetĂ« duan tĂ« shohin se Ă§farĂ« UnĂ« jam duke bĂ«rĂ« me CSS kĂ«tu,
UnĂ« kam nevojĂ« pĂ«r tĂ« shkuar tĂ« hapur qĂ« table.CSS fotografi si.
Pra, ne do tĂ« kthehemi kĂ«tu pĂ«rsĂ«ri nĂ« pemĂ« tonĂ« file.
Ka table.CSS.
Ne do tĂ« pop atĂ« tĂ« hapur.
Tani ne jemi duke parĂ« pak e CSS.
Me sa duket, unĂ« kam njĂ« Ă§ift e gjĂ«rave ndodh kĂ«tu.
UnĂ« me sa duket duan tĂ« vĂ«nĂ« njĂ« pesĂ« piksel, kufirit tĂ« ngurta tĂ« kuqe,
rreth tryezĂ«n time.
Ne tashmĂ« e dimĂ« se kjo do pĂ«r tĂ« shkuar vetĂ«m nĂ« perimetrin.
Ne pamĂ« se nĂ« table2.HTML.
Me Ă§do rresht, unĂ« me sa duket duan tĂ« specifikojĂ«
se lartĂ«sia rresht Ă«shtĂ« 50 pixels i lartĂ«.
Pra, pĂ«r Ă§do rresht, mos harroni kjo Ă«shtĂ« ajo tag tr bĂ«n,
UnĂ« jam duke e bĂ«rĂ« atĂ« 50 pixels i lartĂ«.
>> SĂ« fundi, unĂ« kam kĂ«tĂ« koment.
Dhe kjo Ă«shtĂ« se si ne tĂ« bĂ«rĂ« komente nĂ« CSS.
Ă‹shtĂ« shumĂ« e ngjashme pĂ«r tĂ« kapur bllok Komentet yll Sintaksa slash.
TĂ« gjithĂ« tekstin qĂ« ju dĂ«shironi.
Nuk ka asnjĂ« plagĂ« plagĂ« edhe nĂ« CSS.
PĂ«r komente shkurtĂ«r inline, ne kemi pĂ«r tĂ« pĂ«rdorur kĂ«tĂ« format tĂ« veĂ§antĂ« kĂ«tu.
Ajo duket si unĂ« jam duke bĂ«rĂ« njĂ« shumĂ« gjĂ«ra nĂ« tags mia TD.
Mos harroni tags DT, apo tryezĂ« tĂ« dhĂ«na, tĂ« cilat me tĂ« vĂ«rtetĂ« janĂ« vetĂ«m
shtyllat brenda e rreshtave tanĂ« dhe me sa duket
pĂ«r Ă§do pjesĂ« tĂ« tĂ« dhĂ«nave nĂ« tryezĂ«n time, unĂ« dua
pĂ«r tĂ« vendosur ngjyrĂ«n e sfondit pĂ«r tĂ« jetĂ« i zi, ngjyra tĂ« jetĂ« e bardhĂ«,
ngjyra Ă«shtĂ« ngjyra i dukshĂ«m.
Pra, kjo do tĂ« jetĂ« teksti i faqen time.
UnĂ« dua font tĂ« madh, 22 pikĂ« font, dhe unĂ« dua
qĂ« ajo tĂ« jetĂ« e familjes font, Gjeorgjia.
KĂ«shtu qĂ« unĂ« nuk jam duke shkuar pĂ«r kanĂ« font default.
UnĂ« jam duke shkuar pĂ«r tĂ« specifikojĂ« GjeorgjinĂ«, e cila Ă«shtĂ« njĂ« nga ato web fonts sigurta
qĂ« ne kemi parĂ« mĂ« parĂ«.
UnĂ« dua teksti im tĂ« jetĂ« njĂ« linjĂ« qendra, nĂ« mes tĂ« kutisĂ«,
UnĂ« nuk dua qĂ« ajo tĂ« jetĂ« lĂ«nĂ« njĂ« linjĂ« apo njĂ« linjĂ« tĂ« drejtĂ«.
Dhe unĂ« dua width kolonĂ« e mia tĂ« jetĂ« 50 pixels i gjerĂ« si.
Le tĂ« marrin njĂ« vĂ«shtrim nĂ« Ă§farĂ« kjo duket si,
dhe tĂ« shohim nĂ«se kjo Ă«shtĂ« ndoshta njĂ« pĂ«rmirĂ«sim.
KĂ«shtu qĂ« unĂ« jam duke shkuar pĂ«r tĂ« shkuar nĂ« table3.HTML, e cila Recall, pĂ«rfshin table.CSS si njĂ« lidhje,
dhe ne do tĂ« preview atĂ«.
Kjo Ă«shtĂ« njĂ« shumĂ« e mirĂ«, e drejtĂ«?
Kjo Ă«shtĂ« nĂ« tĂ« vĂ«rtetĂ« filluar tĂ« duken njĂ« shumĂ« mĂ« tepĂ«r si njĂ« tryezĂ« shumĂ«zimit.
UnĂ« kam se kufirit tĂ« kuqe rreth tryezĂ«n time, por tani
UnĂ« gjithashtu kanĂ« pĂ«rcaktuar se Ă§do rresht Ă«shtĂ« 50 pixels i gjerĂ«,
apo Ă«shtĂ« 50 pixels tall-- justifikim me-- Ă§do kolonĂ« Ă«shtĂ« 50 pixels i gjerĂ«.
TĂ« dhĂ«nat nĂ« Ă§do kolonĂ«, dhe vetĂ«m tĂ« dhĂ«nat, ka njĂ« sfond tĂ« zezĂ«.
Pra, kjo Ă«shtĂ« arsyeja pse ata vija tĂ« bardha janĂ« atje.
Sepse hapĂ«sira nĂ« midis gjithĂ« atyre qelizave,
kjo nuk Ă«shtĂ« njĂ« kufi nĂ« dhe nĂ« vetvete, kjo Ă«shtĂ« vetĂ«m
UnĂ« jam vetĂ«m duke plotĂ«suar nĂ« Qelizat, tĂ« cilat nĂ« fakt
i bĂ«n kufijtĂ« e tabelĂ«s, tĂ« cilat me sa duket ka ekzistuar gjithĂ« sĂ« bashku, atĂ«
ishte linjat e vetĂ«m tĂ« hollĂ« tĂ« bardhĂ«.
Tani ata janĂ« tĂ« dukshme.
Tani ata pop jashtĂ« mbi ekran.
Dhe kĂ«shtu kjo Ă«shtĂ« njĂ« shumĂ« e thjeshtĂ« stylesheet qĂ« unĂ« kam aplikuar,
dhe tani tryezĂ«n time, duket shumĂ« mĂ« shumĂ« si njĂ« tavolinĂ« katĂ«r nga katĂ«r shumĂ«zimit,
nĂ« vend tĂ« njĂ« rrĂ«mujĂ« jumbled vetĂ«m, ku Ă§do gjĂ« Ă«shtĂ« e qartĂ« rreshtave dhe kolonave,
por i organizuar jo super tĂ« mirĂ«.
Ne jemi me tĂ« vĂ«rtetĂ« vetĂ«m kruarje sipĂ«rfaqe tĂ« asaj qĂ« ju mund tĂ« bĂ«ni me CSS kĂ«tu.
PĂ«r fat tĂ« mirĂ« dokumentacioni CSS Ă«shtĂ« shumĂ« i thjeshtĂ«.
Ju do tĂ« pĂ«rdorni disa prej saj atributet, mjaft shpesh.
Ato kemi biseduar pĂ«r mĂ« herĂ«t nĂ« kĂ«tĂ« video.
Ka disa qĂ« ju ndoshta nuk do tĂ« pĂ«rdorĂ« tĂ« gjithĂ«.
Dhe kjo Ă«shtĂ« nĂ« rregull, too.
Por vetĂ«m e di, se ka njĂ« shumĂ« e dokumentacionit atje.
Pra, edhe nĂ« qoftĂ« se ne nuk mbulojnĂ« gjithĂ§ka, ju jeni me siguri nuk e la nĂ« tuaj.
Por CSS Ă«shtĂ« me tĂ« vĂ«rtetĂ« zbavitĂ«se tĂ« eksperimentojnĂ« me.
Dhe unĂ« do tĂ« inkurajojmĂ« fuqimisht ju pĂ«r tĂ« luajtur rreth me faqet tuaja web,
dhe tĂ« shohim se si ju mund tĂ« bĂ«ni ato shikoni dhe tĂ« ndjehen tĂ« pĂ«rmirĂ«suar pĂ«rdorues
pĂ«rvoja e vizituar faqen tuaj.
UnĂ« jam Doug Lloyd.
Kjo Ă«shtĂ« CS50.