Kodi i faqes kryesore të Chrome. Si të shikoni kodin burimor të faqes dhe kodin e elementit
Pra, sot do të shikojmë disa mjete të dobishme për mjeshtrat e Uebit që e bëjnë jetën më të lehtë kur dizajnoni një faqe interneti. Le të fillojmë me konsolën për masterin e uebit në Google Chrome. Dhe le të kalojmë nëpër pyetjet që lindin më shpesh për një webmaster gjatë paraqitjes së faqes në internet.
Për të hyrë në tastierë, hapni faqen tuaj të internetit në Google Chrome, kliko me të djathtën kudo në faqen e internetit dhe zgjidh "Shiko kodin e faqes" në menynë rënëse kontekstuale ose në një element specifik për të studiuar duke zgjedhur "Shiko kodin" element".
Në krye do të keni të listuara disa skeda. Sot do të flasim për skedën "Elementet". ,
i cili paraqet elementet e një faqe interneti me theksimin e etiketave, veçorive, nxjerrjen në pah të foleve të elementeve, një paraqitje të hierarkisë së elementit në pemën DOM (një aluzion në fund, nga prindi rrënjë në atë aktual), aftësia për të redaktuar elementët, një listë të vetive të tyre, merrni parasysh kërkimin sipas elementeve, si dhe Le të njihemi me shikimin e stileve css, etj., të lidhura me elementët.
Si mund t'i shikoj të gjitha stilet që lidhen me një element specifik? Cila përdoret tani? Në cilat skedarë ndodhen?
Pra, asgjë nuk mund të jetë më e lehtë! Hapni shfletuesin Google Chrome, hapni faqen tonë - burimin e pyetjeve, kliko me të djathtën mbi elementin e dëshiruar nëse është i dukshëm në kontekstin e faqes dhe zgjidhni "Shiko kodin e elementit" në menunë e kontekstit.
Në fund kemi një tastierë me një skedë të theksuar në të majtë " Elementet" dhe të gjitha stilet që lidhen me elementin në të djathtë, ku: Stilet e llogaritura- këto janë stile të përgjithshme "përmbledhëse" që i janë caktuar elementit nga rregullat dhe cilësimet css të shfletuesit të përdoruesit (mjedisi i tij), dhe në të njëjtën kohë skeda është shembur.
Por ne jemi të interesuar për skedën "Stilet", e zgjeruar nën të, e cila rendit nga ana tjetër të gjitha stilet e caktuara për elementin, si dhe skedarët ku këto rregulla janë specifikuar për këtë element sipas llojit, id, klasës, emrit, vetisë së tij. , atribut etj. Për më tepër, nëse një rregull css është tejkaluar, do të thotë se ai është ripërcaktuar më herët/më vonë (gjë që e bën të lehtë gjurmimin se cili nga rregullat css ka përparësi dhe zbatohet në këtë rast për elementin).
Poshtë konsolës ka një rresht që tregon elementin në hierarkinë e dokumentit, duke ju lejuar lehtësisht të shikoni të gjithë listën e elementeve prindër nga rrënja në elementin e zgjedhur. Diçka si "thërrima buke".
Etiketa HTML nuk është e dukshme në kontekstin e faqes? Apo duhet të gjeni të gjitha etiketat, për shembull, sipas një klase, emri, vetie, lloji të caktuar?
Hapni faqen në Google Chrome, kliko me të djathtën, thirrni menunë e kontekstit, zgjidhni «
Shiko kodin e faqes »
. Shtypni kombinimin e tastit "CTRL + F" në të njëjtën kohë, shkruani frazën që na nevojitet ( Për shembull:
klasa =”mbushje") dhe lëvizni nëpër listën e rezultateve të gjetura, duke parë njëkohësisht të gjitha stilet që lidhen me elementët e dëshiruar në anën e djathtë të faqes.
Si të shikoni kodin html të një elementi(eve) të ngarkuar në mënyrë dinamike (për shembull: nëpërmjet Ajax)
Ne presim që faqja të ngarkohet në Google Chrome. Ne kryejmë veprimet e nevojshme që Ajax të funksionojë. Klikoni me të djathtën mbi të dhënat e ngarkuara, zgjidhni "Shiko kodin e elementit" në menynë e kontekstit dhe ekzaminoni rezultatin në tastierën në skedën "Elementet" në të majtë.
Shikoni ndryshimet e stilit css në kohë reale
Nga rruga, është gjithashtu e përshtatshme të vëzhgoni, nëse është e nevojshme, cilat stile i caktohen një elementi në fluturim, për shembull, kur lëvizni nëpër një galeri dhe ngjarje të tjera të kohëmatësit. Të gjitha stilet e caktuara nëpërmjet javascript në kohë reale do të shfaqen në pronë stil elementi i zgjedhur në dritaren në skedën "Elementet".
Shikoni në mënyrë interaktive ndikimin e rregullave css në prezantimin e etiketave html
Google Chrome ofron një tastierë interaktive për stilet css. Kjo do të thotë që ju jo vetëm që mund të shikoni se cilat stile aplikohen në element, por gjithashtu mund të lëvizni kursorin e miut mbi një veçori specifike css, ta aktivizoni duke përdorur kutinë e zgjedhjes që shfaqet në të djathtë, ose ta çaktivizoni duke pastruar flamurin dhe të shikoni rezultati që rezulton në faqe.
Ne ndryshojmë strukturën e paraqitjes së elementeve html në fluturim (direkt në shfletues)
Pra, ne kemi mësuar tashmë se si të eksplorojmë strukturën e një dokumenti në internet në Google Chrome, tani do të shohim shkurtimisht elementët e redaktimit në fluturim. Ne shkojmë në tastierë në çdo mënyrë të përshtatshme për ne. Ne gjejmë elementin e dëshiruar në skedën "Elementet", kliko me të djathtën mbi të, duke thirrur kështu menunë e kontekstit që shfaqet:
- Shto atribut– shton një atribut për elementin e specifikuar. Sapo kursori të aktivizohet, fillojmë të vendosim vetinë e dëshiruar. Për shembull: shkruani name="itemImage", i cili do të shtohet menjëherë në elementin tonë.
- Redakto atributin– nëse klikoni me të djathtën mbi një atribut elementi, artikulli bëhet i disponueshëm redaktoniatribut. Klikoni dhe modifikoni.
Shembull përdorimi: Ne harruam fjalëkalimin e ruajtur nën yjet në Google Chrome (nëse fjalëkalimi është ruajtur në këtë shfletues). Klikoni me të djathtën në elementin me fjalëkalimin e futur, klikoni në "Shiko kodin e elementit" ,
në tastierën në skedën e majtë Elementet kliko me të djathtën në atributin type="password", kliko me të majtën Redaktoatribut ndryshoni atributin tip =”fjalëkalim" në tip =”tekst", dhe tani, në vend të yjeve, i njëjti fjalëkalim shfaqet në formë teksti.
- Redaktohtml– kliko me të djathtën mbi elementin në tastierë Elementet, zgjidhni Redaktohtml, ndryshoni kodin sipas dëshirës tuaj.
- KopjosiHTML– ne kopjojmë pjesën e HTML që na nevojitet për kërkime të mëtejshme, të themi, në një bllok shënimesh, ose për qëllime të tjera ku duhet të aplikojmë saktësisht të njëjtën paraqitje. Ne kursejmë kohë.
- KopjoXPATH– kopjon paraqitjen XPATH të strukturës nga rrënja e elementit prind në elementin e zgjedhur.
- Fshijenyje– nëse duhet të hiqni elementin e përzgjedhur aktualisht dhe të gjithë fëmijët e tij nga konteksti i faqes së internetit dhe shikoni rezultatin.
- fjalëmbështjell– do të japë një pamje të faqes në internet në kontekstin e konsolës Elementet më të lexueshme.
Në artikujt e mëposhtëm do të vazhdojmë të shqyrtojmë mjetet për webmasterët dhe në veçanti do të njihemi me skedat e mbetura të veglave për webmasterët në Google Chrome, dhe gjithashtu merrni parasysh korrigjimin e gabimeve të javascript duke përdorur shfletues të ndryshëm
Duke parë faqet e panumërta në internet, mund të hasni në ato që na pëlqejnë shumë. Menjëherë lindin një sërë pyetjesh. A është krijuar faqja duke përdorur kodin e bërë në shtëpi ose ndonjë lloj CMS? Çfarë stilesh CSS ka? Cilat janë meta etiketat e saj? Dhe kështu me radhë.
Ka shumë mjete që mund të përdoren për të nxjerrë informacione në lidhje me kodin e një faqe interneti. Por ne gjithmonë kemi në dorë butonin e djathtë të miut. Kjo është ajo që ne do të përdorim, duke përdorur faqen time si shembull.
Si të shikoni kodin e faqes?
Për të parë kodin burimor të faqes së sajtit, duhet të vendosni miun mbi çdo zonë të faqes së internetit (përveç imazheve dhe lidhjeve). Pas kësaj, klikoni në butonin e djathtë të miut. Një dritare me disa opsione do të hapet para nesh (ato mund të ndryshojnë pak në shfletues të ndryshëm). Në shfletuesin Google Chrome, për shembull, këto janë komandat:
- mbrapa;
- përpara;
- rindezje;
- ruaj si;
- vulë;
- përkthe në rusisht;
- shikoni kodin e faqes;
- shikoni kodin.
Duhet të klikojmë shikoni kodin e faqes, dhe kodi html i faqes së faqes do të hapet para nesh.
Shikimi i kodit të faqes: çfarë t'i kushtoni vëmendje?
Pra, kodi i faqes Html është një listë e numëruar rreshtash, secila prej të cilave mbart informacione se si është krijuar kjo faqe. Për të mësuar shpejt të kuptoni këtë numër të madh të shenjave dhe simboleve të veçanta, duhet të bëni dallimin midis seksioneve të ndryshme të kodit.
Për shembull, rreshtat e kodit brenda etiketës së kokës përmbajnë informacion për motorët e kërkimit dhe webmasterët. Ato nuk shfaqen në sit. Këtu mund të shihni se për cilat fjalë kyçe promovohet kjo faqe, si shkruhet titulli dhe përshkrimi i saj. Gjithashtu këtu mund të gjeni një lidhje, pas së cilës do të mësojmë për familjen e shkronjave të Google të përdorura në faqe.
Nëse faqja është krijuar në CMS WordPress ose Joomla, atëherë kjo do të jetë gjithashtu e dukshme këtu. Për shembull, kjo zonë shfaq informacion në lidhje me një temë të WordPress ose shabllon të faqes së internetit të Joomla. Mund ta shihni duke lexuar përmbajtjen e lidhjeve të theksuara me ngjyrë blu. Një lidhje tregon një shabllon të internetit.
Për shembull:
//fonts.googleapis.com/css?family=Source+Sans+Pro%3A400%2C400italic%2C600&ver=4.5.3
Do të shohim stilet e shkronjave CSS të faqes. Në këtë rast, përdoret fonti. Kjo mund të shihet këtu - font-family: 'Source Sans Pro'.
Kjo faqe është optimizuar duke përdorur shtojcën SEO Yoast. Kjo mund të shihet nga kjo pjesë e komentuar e kodit:
Kjo faqe është optimizuar me shtesën Yoast SEO v3.4.2 - https://yoast.com/wordpress/plugins/seo/
Të gjitha informacionet e përfshira brenda etiketës së trupit shfaqen nga shfletuesi në ekranin e monitorit. Këtu shohim kodin html të faqes, dhe në fund është kodi i skriptit Yandex Metrics. Ai është i rrethuar nga një etiketë e komentuar me tekstin:
/Yandex.Metrika sportel
Le ta përmbledhim
Pasi të kemi bërë një analizë mjaft sipërfaqësore të kodit të faqes kryesore të faqes, mund të nxjerrim një përfundim se me cilat mjete është bërë kjo faqe. Ne pamë në të:
- CMS WordPress;
- font Google Source Sans Pro;
- Tema e WordPress – Sydney;
- shtojcat Yoast;
- Njehsuesi i metrikës Yandex.
Tani parimi i analizimit të kodit html të një faqe interneti është mjaft i qartë. Nuk është aspak e nevojshme të mbani të hapur faqen që po kërkoni në shfletues. Ju mund ta ruani kodin e faqes në kompjuterin tuaj duke përdorur kombinimet e tasteve ctrl+a, ctrl+c, ctrl+v. Ngjitni atë në çdo redaktues teksti (mundësisht Notepad++) dhe ruajeni me shtesën html. Kështu, në çdo kohë mund ta studioni më thellë dhe të gjeni informacione më të dobishme për veten tuaj.
Shkathtësi ndryshoni kodin burimor të faqes– një aftësi e dobishme për një përdorues të avancuar të internetit. Duke zëvendësuar kodin HTML, ju mund të ndryshoni faqen e hapur të internetit sipas dëshirës tuaj. Në këtë artikull do t'ju tregojmë si të ndryshoni kodin e faqes në Google Chrome. Sidoqoftë, në shfletuesit e tjerë gjithçka bëhet në mënyrë të ngjashme, kështu që nuk duhet të ketë ndonjë vështirësi.
Cili është kodi HTML i faqes?
Çdo faqe që hapni në shfletuesin tuaj ka kodin e vet në gjuhën e shënjimit HTML. Ky kod përfaqëson etiketat dhe tekstin. Etiketat janë etiketa unike që i tregojnë shfletuesit se si të shfaqë këtë ose atë pjesë të faqes. Teksti është përmbajtja e faqes, ajo që shikon përdoruesi. Gjithashtu, stilet CSS mund të lidhen me faqen, të cilat përcaktojnë pamjen e elementeve të faqes. te ndryshoni kodin burimor të faqes ju nuk keni nevojë të njihni plotësisht HTML dhe CSS, dhe së shpejti do ta shihni vetë.
Pse të ndryshoni një faqe interneti?
Mund të zëvendësoni të dhënat në sajt, të ndryshoni tekstin e mesazhit ose të bëni një pamje të rreme të ekranit. Ju lutemi vini re se të gjitha ndryshimet janë të dukshme vetëm për ju dhe do të zhduken kur të rifreskoni faqen. Gjithashtu të dhënat e ndryshuara nuk do të jenë reale. Për shembull, nëse nuk kam 10 dollarë dhe i ndryshoj në 100, atëherë nuk do të kem më para. Kjo është vetëm shfaqja e faqes nga shfletuesi. Shembull:
Pas:
Për shembull, unë do të marr të njëjtën faqe dhe do të ndryshoj njoftimin e mëparshëm të artikullit "Hapja e faqes kryesore në Google Chrome. Unë kliko me të djathtën mbi elementin që dua të ndryshoj, për shembull, titullin e njoftimit dhe zgjedh "Shiko kodin".
Në dritaren që hapet, shkoni te skeda Elemente dhe shihni kodin HTML të faqes. Në të duhet të gjejmë tekstin që na intereson. (nënvizuar me të kuqe)
Tani do të fshij tekstin e vjetër dhe do të shkruaj në një të ri.
Kjo është e gjitha, titulli i njoftimit është ndryshuar. Tani do të ndryshoj vetë njoftimin, etiketat dhe kategorinë.
Mund të futni një imazh tjetër duke ndryshuar atributin src në etiketën img.
Nëse hapni ndonjë faqe interneti, ajo do të përmbajë elementë tipikë që nuk ndryshojnë në varësi të llojit dhe fokusit të faqes. Shembulli 4.1 tregon kodin për një dokument të thjeshtë që përmban etiketa bazë.
Shembulli 4.1. Kodi burimor i faqes së internetit
Shembull ueb faqe
Drejtimi
Paragrafi i parë.
Paragrafi i dytë.
Kopjoni përmbajtjen e këtij shembulli dhe ruajeni në dosjen c:\www\ si shembull41.html. Pas kësaj, hapni shfletuesin dhe hapni skedarin përmes artikullit të menusë Skedari > Hap skedarin (Ctrl+O). Në dialogun e përzgjedhjes së dokumentit, zgjidhni skedarin shembull41.html. Faqja e internetit e paraqitur në Fig. do të hapet në shfletues. 4.1.
Oriz. 4.1. Rezultati i ekzekutimit të shembullit
Elementika për qëllim të tregojë llojin e dokumentit aktual - DTD (përkufizimi i llojit të dokumentit, përshkrimi i llojit të dokumentit). Kjo është e nevojshme në mënyrë që shfletuesi të kuptojë se si të interpretojë faqen aktuale të internetit, sepse HTML ekziston në disa versione, përveç kësaj, ekziston XHTML (Extensible HyperText Markup Language), e cila është e ngjashme me HTML, por ndryshon prej saj në sintaksë. Në mënyrë që shfletuesi "të mos ngatërrohet" dhe të kuptojë se sipas cilit standard duhet të shfaqet uebfaqja, është e nevojshme të vendosni në rreshtin e parë të kodit
.
Ka disa lloje, ato ndryshojnë në varësi të versionit të HTML që synojnë. Në tabelë 4.1. Janë dhënë llojet kryesore të dokumenteve me përshkrimet e tyre.
Tabela 4.1. DTD të vlefshme | DOCTYPE |
Përshkrim |
|---|
| HTML 4.01
|
|
|
Sintaksë e rreptë HTML. |
|
|
Sintaksa kalimtare HTML. |
|
|
Një dokument HTML përdor korniza. |
| HTML 5
|
|
|
Ky version i HTML ka vetëm një tip doctype. |
| XHTML 1.0
|
|
|
Sintaksë e rreptë XHTML. |
|
|
Sintaksa kalimtare XHTML. |
|
|
Dokumenti është i shkruar në XHTML dhe përmban korniza. |
| XHTML 1.1
|
|
|
Zhvilluesit e XHTML 1.1 presin që ai gradualisht të zëvendësojë HTML. Siç mund ta shihni, ky përkufizim nuk ka ndarje në lloje, pasi sintaksa është e njëjtë dhe i bindet rregullave të qarta. |
Dallimi midis një përshkrimi të rreptë dhe atij kalimtar të dokumentit është një qasje e ndryshme për të shkruar kodin e dokumentit. HTML i rreptë kërkon respektim të rreptë të specifikimeve HTML dhe është i pafalshëm. HTML-ja kalimtare është më e relaksuar për disa gabime të kodit, kështu që ky lloj preferohet të përdoret në raste të caktuara.
Për shembull, në HTML dhe XHTML strikte, kërkohet prania e etiketës
, dhe në HTML kalimtare mund të hiqet dhe të mos specifikohet. Në të njëjtën kohë, kujtojmë se shfletuesi do ta shfaqë dokumentin në çdo rast, pavarësisht nëse përputhet me sintaksën apo jo. Ky kontroll kryhet duke përdorur një vërtetues dhe ka për qëllim kryesisht zhvilluesit të gjurmojnë gabimet në dokument.</p>
<p>Në të ardhmen do të përdorim kryesisht strikte<!DOCTYPE>, përveç nëse specifikohet ndryshe. Kjo do të na lejojë të shmangim gabimet e zakonshme dhe të na mësojë të shkruajmë kodin e saktë sintaksor.</p>
<p>Shpesh mund të gjeni kodin HTML pa përdorur asnjë<!DOCTYPE>, faqja e internetit do të shfaqet ende në këtë rast. Megjithatë, mund të ndodhë që i njëjti dokument të shfaqet ndryshe në shfletues kur përdorni<!DOCTYPE>dhe pa të. Për më tepër, shfletuesit mund të shfaqin dokumente të tilla në mënyrën e tyre, si rezultat faqja do të "shkëputet", d.m.th. do të shfaqet krejtësisht ndryshe nga ajo që kërkon zhvilluesi. Për të shmangur situata të tilla, gjithmonë shtoni<!DOCTYPE>deri në fillim të dokumentit.</p><p>Etiketë <html>përcakton fillimin e skedarit HTML, titulli ruhet brenda tij ( <head>) dhe trupi i dokumentit ( <body>
).</p><p>Titulli i dokumentit, i quajtur gjithashtu bllok <head>, mund të përmbajë tekst dhe etiketa, por përmbajtja e këtij seksioni nuk shfaqet drejtpërdrejt në faqe, përveç në kontejner <title>
.</p><p>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</p><p>Etiketë <meta>është universale dhe shton një klasë të tërë aftësish, në veçanti, me ndihmën e meta etiketave, siç quhet përgjithësisht ky etiketë, mund të ndryshoni kodimin e faqes, të shtoni fjalë kyçe, përshkrimin e dokumentit dhe shumë më tepër. Kështu që shfletuesi të kuptojë se ka të bëjë me kodimin UTF-8 (format transformimi Unicode), dhe kjo linjë shtohet.</p><p>
<title>Shembull ueb faqe
Etiketë
përcakton titullin e një faqe interneti, ky është një nga elementët e rëndësishëm të krijuar për të zgjidhur shumë probleme. Në sistemin operativ Windows, teksti i titullit shfaqet në këndin e sipërm të majtë të dritares së shfletuesit (Figura 4.2).</p>
<p><img src='https://i0.wp.com/htmlbook.ru/files/images/samhtml/fig_1_04_02.png' height="37" width="194" loading=lazy loading=lazy></p>
<p>Oriz. 4.2. Pamja e kokës në shfletues</p>
<p>Etiketë <title>është i detyrueshëm dhe duhet patjetër të jetë i pranishëm në kodin e dokumentit.</p><p>Duhet të shtoni një etiketë mbyllëse</head> për të treguar që blloku i titullit të dokumentit është i plotë.</p><p>Trupi i dokumentit <body>të destinuara për vendosjen e etiketave dhe përmbajtjes së një faqe interneti.</p><p>
<h1>Drejtimi</h1>
</p><p>HTML ofron gjashtë tituj tekstesh të niveleve të ndryshme që tregojnë rëndësinë relative të seksionit pas titullit. Po, etiketo <h1>përfaqëson titullin më të rëndësishëm të nivelit të parë dhe etiketën <h6>shërben për të treguar titullin e nivelit të gjashtë dhe është më pak i rëndësishëm. Si parazgjedhje, titulli i nivelit të parë shfaqet me fontin më të madh të shkronjave dhe titujt pasues të nivelit janë më të vegjël në madhësi. Etiketat <h1>...<h6>Referojuni elementeve të bllokut, ata gjithmonë fillojnë në një rresht të ri dhe pas tyre, elementë të tjerë shfaqen në rreshtin tjetër. Për më tepër, hapësira e bardhë shtohet para dhe pas titullit.</p><p>
<!-- Комментарий -->
</p><p>Disa tekste mund të fshihen nga shfaqja në shfletues duke e bërë atë një koment. Megjithëse ky tekst nuk do të shihet nga përdoruesi, ai përsëri do të transmetohet në dokument, kështu që nëse shikoni kodin burimor, mund të zbuloni shënime të fshehura.</p>
<p>Probabiliteti për të parë në fillestar <b>kodi</b> ueb <b>faqet</b>, i marrë nga shfletuesi si rezultat i një kërkese drejtuar serverit, është i disponueshëm pothuajse në çdo shfletues të internetit. Qasja në komandën përkatëse është e organizuar përafërsisht në mënyrë identike, por ka dallime të rëndësishme në metodën dhe formën në të cilën fillestari <b>kodi</b> .</p>
<h3>Udhëzimet</h3>
<p><b>1.
</b> Në shfletuesin Mozilla FireFox, zgjeroni seksionin "Shiko" në meny dhe klikoni "Initial" <b>kodi</b> <b>faqet</b>" I njëjti artikull është gjithashtu në menynë e kontekstit që shfaqet nëse klikoni me të djathtën mbi tekst <b>faqet</b>. Ju gjithashtu mund të përdorni kombinimin e tastit CTRL + U. Mozilla FireFox nuk përdor programe të jashtme - fillestare <b>kodi</b> <b>faqet</b> me theksimin e sintaksës do të hapet në një dritare të veçantë të shfletuesit.</p><p><img src='https://i0.wp.com/st03.kakprosto.ru/tumb/680/images/article/2011/7/8/1_52552b95d5fa552552b95d5fe3.jpg' height="748" width="680" loading=lazy loading=lazy></p><p><b>2.
</b> Në Internet Explorer, klikoni në menunë File dhe zgjidhni Edit in Notepad. Në vend të emrit Notepad, mund të shkruhet një program tjetër që keni caktuar në cilësimet e shfletuesit për të parë fillestarin <b>kodi</b> A. Ne klikim <b>faqet</b> me butonin e djathtë të miut, shfaqet një meny konteksti, e cila gjithashtu ka një artikull që ju lejon të hapni fillestarin <b>kodi</b> <b>faqet</b> në një program të jashtëm - "Shiko HTML- <b>kodi</b> A".</p><p><img src='https://i2.wp.com/st03.kakprosto.ru/tumb/680/images/article/2011/7/8/1_52552b95df96052552b95df9bd.jpg' height="669" width="663" loading=lazy loading=lazy></p><p><b>3.
</b> Në shfletuesin Opera, hapni menunë, shkoni te seksioni "Faqja" dhe do të keni mundësinë të zgjidhni artikullin "Fillimi" në nënseksionin "Mjetet e zhvillimit". <b>kodi</b>"ose zëri "Inicial <b>kodi</b> kornizë." Kësaj përzgjedhjeje i janë caktuar përkatësisht çelësat e nxehtë CTRL + U dhe CTRL + SHIFT + U. Në një meny konteksti të lidhur me një klikim <b>faqet</b> kliko me të djathtën, ekziston gjithashtu një artikull "Initial <b>kodi</b>" Opera hap burimin <b>faqet</b> në një program të jashtëm që është caktuar në OS ose në cilësimet e shfletuesit për redaktimin e skedarëve HTML.</p><p><img src='https://i2.wp.com/st03.kakprosto.ru/tumb/680/images/article/2011/7/8/1_52552b95eb30952552b95eb346.jpg' width="100%" loading=lazy loading=lazy></p><p><b>4.
</b> Shfletuesi Google Chrome pa asnjë dyshim ka organizimin më të mirë për shikimin e fillestarit <b>kodi</b> A. Duke klikuar me të djathtën në faqe, mund të zgjidhni ta shikoni <b>kodi</b> A <b>faqet</b>"dhe më pas kodi burimor me theksimin e sintaksës do të hapet në një skedë të veçantë. Ose mund të preferoni linjën "Shiko" në të njëjtën meny <b>kodi</b> element” dhe shfletuesi në të njëjtën skedë do të hapë dy korniza shtesë në të cilat mund të inspektoni HTML dhe CSS <b>kodi</b>çdo element <b>faqet</b>. Shfletuesi do t'i përgjigjet kursorit që lëviz nëpër rreshta <b>kodi</b> dhe, duke theksuar elementet në faqe që korrespondojnë me këtë seksion të HTML <b>kodi</b> A.</p><p><img src='https://i1.wp.com/st03.kakprosto.ru/tumb/680/images/article/2011/7/8/1_52552b9603c4652552b9603c84.jpg' width="100%" loading=lazy loading=lazy></p><p><b>5.
</b> Në shfletuesin Apple Safari, zgjeroni seksionin View dhe zgjidhni View HTML <b>kodi</b> A". Në menynë që shfaqet kur klikoni me të djathtën për të hapur <b>faqet</b>, artikulli përkatës quhet "Shiko burimin". Këtij veprimi i caktohen tastet kryesore CTRL + ALT + U. Initial <b>kodi</b> hapet në një dritare të veçantë të shfletuesit.</p><p><img src='https://i0.wp.com/st03.kakprosto.ru/tumb/680/images/article/2011/7/8/1_52552b960eafe52552b960eb45.jpg' width="100%" loading=lazy loading=lazy></p>
<script type="text/javascript">
<!--
var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})()
//-->
</script><br>
<br>
<script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+
escape(document.referrer)+((typeof(screen)=="undefined")?"":
";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth?
screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+
";"+Math.random()+
"border='0' width='1' height='1' loading=lazy loading=lazy>");</script>
</div>
<div class="single-popular">
<div class="single-popular-tit col-lg-12">Të njohura në kategorinë:</div>
<div class="single-popular-item col-lg-6 col-md-6 col-sm-6 col-xs-6">
<div class="single-popular-item-wrp">
<img width="150" height="120" src="/uploads/5be8b76667696c4cd63a8c38979b50af.jpg" class="attachment-sm-widget size-sm-widget wp-post-image" alt="Si të kombinoni shtresat në Photoshop në një ose t'i kombinoni ato në një grup Si të kombinoni disa shtresa në Photoshop"/ loading=lazy loading=lazy>
<div class="single-popular-item-tit">Si të bashkoni shtresat në Photoshop në një ose t'i kombinoni ato në një grup ...</div>
<a href="https://innovakon.ru/sq/settings/sposoby-obedineniya-sloev-v-fotoshope-kak-obedinit-sloi-v-fotoshope-v.html" rel="bookmark" title="Si të kombinoni shtresat në Photoshop në një ose t'i kombinoni ato në një grup Si të kombinoni disa shtresa në Photoshop">lexoni</a>
<div class="clr">
</div>
</div>
</div>
<div class="single-popular-item col-lg-6 col-md-6 col-sm-6 col-xs-6">
<div class="single-popular-item-wrp">
<img width="150" height="120" src="/uploads/33b72e60e1d3066a9663f391221dc014.jpg" class="attachment-sm-widget size-sm-widget wp-post-image" alt="Transferoni kontaktet në një telefon të ri android"/ loading=lazy loading=lazy>
<div class="single-popular-item-tit">Transferoni kontaktet në një telefon të ri android</div>
<a href="https://innovakon.ru/sq/phone/perenos-kontaktov-na-novyi-telefon-android-android-prilozheniya.html" rel="bookmark" title="Transferoni kontaktet në një telefon të ri android">lexoni</a>
<div class="clr">
</div>
</div>
</div>
<div class="single-popular-item col-lg-6 col-md-6 col-sm-6 col-xs-6">
<div class="single-popular-item-wrp">
<img width="150" height="120" src="/uploads/ff504b14456f4702a94368a161811b1d.jpg" class="attachment-sm-widget size-sm-widget wp-post-image" alt="Samsung Galaxy rindizet vetë - Zgjidhje Galaxy note 4 rindizet vetë"/ loading=lazy loading=lazy>
<div class="single-popular-item-tit">Samsung Galaxy rindizet vetë - Zgjidhjet e Galaxy Note...</div>
<a href="https://innovakon.ru/sq/internet/esli-xiaomi-postoyanno-perezagruzhaetsya-samsung-galaksi-perezagruzhaetsya-sam-po.html" rel="bookmark" title="Samsung Galaxy rindizet vetë - Zgjidhje Galaxy note 4 rindizet vetë">lexoni</a>
<div class="clr">
</div>
</div>
</div>
<div class="single-popular-item col-lg-6 col-md-6 col-sm-6 col-xs-6">
<div class="single-popular-item-wrp">
<img width="150" height="120" src="/uploads/242e09224609f2b7cbd6b5b9f2adc411.jpg" class="attachment-sm-widget size-sm-widget wp-post-image" alt="Karakteristikat kryesore të Kaspersky Rescue Disk"/ loading=lazy loading=lazy>
<div class="single-popular-item-tit">Karakteristikat kryesore të Kaspersky Rescue Disk</div>
<a href="https://innovakon.ru/sq/rates/skachat-zagruzochnyi-disk-kasperskogo-osnovnye-vozmozhnosti-kaspersky-rescue.html" rel="bookmark" title="Karakteristikat kryesore të Kaspersky Rescue Disk">lexoni</a>
<div class="clr">
</div>
</div>
</div>
<div class="clr"></div>
</div>
</div>
<div class="sidebar col-lg-3 col-md-4 col-sm-12">
<div class="sidebar-wrp">
<div class="sidebar-wrp-title">Artikujt e fundit</div>
<div class="sidebar-wrp-des">
<div class="last-post col-lg-12 col-md-12 col-sm-6 col-xs-6">
<div class="last-post-img">
<img width="60" height="48" src="/uploads/d93303aadea847492ee52538b585df87.jpg" class="attachment-sm-widget2 size-sm-widget2 wp-post-image" alt="" / loading=lazy loading=lazy> </div>
<div class="last-post-tit">MacBook nuk do të lidhet me wifi MacBook nuk do të shohë...</div>
<div class="clr"></div>
<a href="https://innovakon.ru/sq/phone/macbook-ne-podklyuchaetsya-k-wifi-avtomaticheski-makbuk-ne-podklyuchaetsya-k-wifi-makbuk-ne-vidit-vai-fai.html">lexoni</a>
</div>
<div class="last-post col-lg-12 col-md-12 col-sm-6 col-xs-6">
<div class="last-post-img">
<img width="60" height="48" src="/uploads/094fe0c598853f299be65e8611b45d60.jpg" class="attachment-sm-widget2 size-sm-widget2 wp-post-image" alt="" / loading=lazy loading=lazy> </div>
<div class="last-post-tit">Si të fitoni para në WebMoney</div>
<div class="clr"></div>
<a href="https://innovakon.ru/sq/internet/kak-zarabotat-rubli-na-webmoney-kak-zarabotat-na-webmoney-proverennye.html">lexoni</a>
</div>
<div class="last-post col-lg-12 col-md-12 col-sm-6 col-xs-6">
<div class="last-post-img">
<img width="60" height="48" src="/uploads/280d369c9d1e343119c3d855af4b9c4d.jpg" class="attachment-sm-widget2 size-sm-widget2 wp-post-image" alt="" / loading=lazy loading=lazy> </div>
<div class="last-post-tit">Tableti "Supra": vlerësimet e klientëve</div>
<div class="clr"></div>
<a href="https://innovakon.ru/sq/rates/planshet-podelka-est-takoi-supra-firma-supra-planshet-otzyvy-pokupatelei-plyusy-i-minusy.html">lexoni</a>
</div>
<div class="last-post col-lg-12 col-md-12 col-sm-6 col-xs-6">
<div class="last-post-img">
<img width="60" height="48" src="/uploads/b1724f08fa52145089eaa72f836127ee.jpg" class="attachment-sm-widget2 size-sm-widget2 wp-post-image" alt="" / loading=lazy loading=lazy> </div>
<div class="last-post-tit">Vendndodhjet e anijeve në kohë reale</div>
<div class="clr"></div>
<a href="https://innovakon.ru/sq/settings/voennye-korabli-v-realnom-vremeni-onlain-mestonahozhdeniya-sudov-v.html">lexoni</a>
</div>
<div class="last-post col-lg-12 col-md-12 col-sm-6 col-xs-6">
<div class="last-post-img">
<img width="60" height="48" src="/uploads/534951a61241c179a7c060b9fe1143c8.jpg" class="attachment-sm-widget2 size-sm-widget2 wp-post-image" alt="" / loading=lazy loading=lazy> </div>
<div class="last-post-tit">Programet më të mira për Android Regjistroni thirrjet nga...</div>
<div class="clr"></div>
<a href="https://innovakon.ru/sq/rates/prilozheniya-dlya-android-obuchayushchie-programmy-dlya-detei-luchshie.html">lexoni</a>
</div>
<div class="last-post col-lg-12 col-md-12 col-sm-6 col-xs-6">
<div class="last-post-img">
<img width="60" height="48" src="/uploads/e280b0808c5e749938522ba1df2a41ec.jpg" class="attachment-sm-widget2 size-sm-widget2 wp-post-image" alt="" / loading=lazy loading=lazy> </div>
<div class="last-post-tit">Heqja e jo-ndjekësve në Twitter</div>
<div class="clr"></div>
<a href="https://innovakon.ru/sq/services/kak-udalit-ne-vzaimnyh-chitatelei-v-twitter-udalyaem-ne-chitatelei-v.html">lexoni</a>
</div>
<div class="last-post col-lg-12 col-md-12 col-sm-6 col-xs-6">
<div class="last-post-img">
<img width="60" height="48" src="/uploads/229610355b0a27a465c73ddb25664556.jpg" class="attachment-sm-widget2 size-sm-widget2 wp-post-image" alt="" / loading=lazy loading=lazy> </div>
<div class="last-post-tit">Lidhja e internetit në një laptop: të gjitha të mundshme...</div>
<div class="clr"></div>
<a href="https://innovakon.ru/sq/phone/kak-vklyuchit-internet-na-kompyutere-ispolzuya-mobilnyi-telefon.html">lexoni</a>
</div>
<div class="last-post col-lg-12 col-md-12 col-sm-6 col-xs-6">
<div class="last-post-img">
<img width="60" height="48" src="/uploads/5399be52c80b405fedf00779a6136b42.jpg" class="attachment-sm-widget2 size-sm-widget2 wp-post-image" alt="" / loading=lazy loading=lazy> </div>
<div class="last-post-tit">Samsung Galaxy S IV është flamuri i ri...</div>
<div class="clr"></div>
<a href="https://innovakon.ru/sq/phone/samsung-galaxy-s4-vtoroi-vzglyad-samsung-galaxy-s-iv-novyi-flagman-galakticheskogo-masshtaba-galak.html">lexoni</a>
</div>
<div class="clr"></div>
</div>
</div>
<div id="text-4" class="widget widget_text sidebar-wrp"> <div class="textwidget">
</div>
</div>
<div id="ketena1" style="height:500px;width:260px;" align="center"></div>
<div class="clr"></div>
</div>
</div>
</div>
</div>
<div id="footer">
<div class="container">
<div class="row">
<div class="footer-contacts col-lg-6 col-md-6 col-sm-12 col-xs-12">
<img src="/logo/logo.png" loading=lazy loading=lazy>
<div class="footer-contacts-tit">innovakon.ru <br>Telefonat celularë dhe komunikimet</div>
<div class="footer-soc">
<div class="footer-soc-wrp">
<div class="soc_w">
<a href="#" class="soc-link vk" target="_blank"></a>
<a href="#" class="soc-link fb" target="_blank"></a>
</div>
</div>
</div>
</div>
<div class="footer-links col-lg-4 col-md-6 col-sm-12 col-xs-12">
</div>
<div class="footer-links col-lg-4 col-md-4 col-sm-4 col-xs-4" style="display: block;">
<ul>
<li><a href="">Redaksia e projektit</a></li>
<li><a href="">Reklamimi në faqen e internetit</a></li>
</ul>
<ul>
<li><a href="https://innovakon.ru/sq/feedback.html">Kontaktet</a></li>
<li><a href="https://innovakon.ru/sq/sitemap.xml">Harta e faqes</a></li>
</ul>
</div>
</div>
</div>
<div class="copyright">© 2024 Telefonat celularë dhe komunikimet</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="https://innovakon.ru/wp-content/themes/trudinsp/js/bootstrap.min.js"></script>
<script type="text/javascript" src="https://innovakon.ru/wp-content/themes/trudinsp/js/SmoothScroll.js"></script>
<a id="scroll-to-top" href="#" title="Lëvizni në krye">Top</a>
<script type='text/javascript' src='https://innovakon.ru/wp-content/plugins/contact-form-7/includes/js/jquery.form.min.js?ver=3.51.0-2014.06.20'></script>
<script type='text/javascript' src='https://innovakon.ru/wp-content/plugins/contact-form-7/includes/js/scripts.js?ver=4.4.1'></script>
<script type='text/javascript' src='https://innovakon.ru/wp-content/plugins/jquery-smooth-scroll/js/jss-script.min.js?ver=4.8.3'></script>
<script type='text/javascript' src='https://innovakon.ru/wp-content/plugins/table-of-contents-plus/front.min.js?ver=1509'></script>
<script type='text/javascript' src='/wp-includes/js/jquery/ui/effect.min.js?ver=1.11.4'></script>
<script type='text/javascript' src='/wp-includes/js/jquery/ui/effect-blind.min.js?ver=1.11.4'></script>
<script type='text/javascript'>
/* <![CDATA[ */
var stbUserOptions = { "mode":"css","cssOptions":{ "roundedCorners":false,"mbottom":20,"imgHide":"http:\/\/innovakon.ru\/wp-content\/plugins\/wp-special-textboxes\/themes\/stb-metro\/minus.png","imgShow":"http:\/\/innovakon.ru\/wp-content\/plugins\/wp-special-textboxes\/themes\/stb-metro\/plus.png","strHide":"\u0421\u043a\u0440\u044b\u0442\u044c","strShow":"\u041f\u043e\u043a\u0430\u0437\u0430\u0442\u044c"} };
/* ]]> */
</script>
<script type='text/javascript' src='https://innovakon.ru/wp-content/plugins/wp-special-textboxes/js/wstb.min.js?ver=5.5.101'></script>
<script type='text/javascript' src='/wp-includes/js/wp-embed.min.js?ver=4.8.3'></script>
<script type="text/javascript" id="slb_context">/* <![CDATA[ */if ( !!window.jQuery ) { (function($){ $(document).ready(function(){ if ( !!window.SLB ) { { $.extend(SLB, { "context":["public","user_guest"]} );} } })} )(jQuery);} /* ]]> */</script>
<script type="text/javascript">
<!--
var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})()
//-->
</script><br>
<br>
</body>
</html> 