"Inspect Element" është një mjet zhvilluesi në shfletuesin Firefox që mund ta përdorni për të gjetur kodin HTML në çdo faqe në internet. Fletët e stilit HTML dhe CSS të një faqe në internet mund të redaktohen me "Inspect Element". Mund të provoni të redaktoni një faqe sipas dëshirës tuaj dhe ta ktheni atë në atë që ishte, thjesht duke ringarkuar faqen e redaktuar.
Hapi
Pjesa 1 nga 2: Kontrollimi i elementeve
Hapi 1. Përditësoni Firefox -in (opsional)
Possibleshtë e mundur që ju nuk do të jeni në gjendje të hyni në veçoritë e diskutuara në këtë artikull nëse përdorni një version të vjetër të Firefox. Përditësimi do të instalohet automatikisht kur kontrolloni se cilin version të Firefox -it po përdorni.
Firefox 9 dhe versionet e mëparshme nuk e kanë fare mjetin "Inspect Element"
Hapi 2. Klikoni me të djathtën mbi çdo element të faqes në internet
Mund të klikoni me të djathtën mbi çdo imazh, tekst, sfond ose element. Nëse miu juaj ka vetëm një buton, një kombinim i klikimit të majtë dhe tastit të Kontrollit do të rezultojë në një klikim të djathtë.
Hapi 3. Klikoni "Inspect Element" nga menyja zbritëse
Një shirit mjetesh do të shfaqet në fund të dritares. Një panel poshtë shiritit të veglave gjithashtu do të shfaqet dhe do të shfaq kodin HTML në faqen aktive.
Hapi 4. Njihuni me shiritat dhe panelet ekzistuese të veglave
Kur përdorni "Inspect Element", disa panele do të hapen poshtë dritares së shfletuesit. Më poshtë përshkruhen emrat dhe funksionet e shiritave të veglave dhe paneleve në "Inspect Element":
- Në rreshtin e sipërm është Toolbar Toolbox. Ka disa mjete për t'u gjetur këtu, por ne do të përqendrohemi në butonin Inspektor në të majtë. Sigurohuni që ky buton të jetë aktiv (i treguar nga ngjyra e butonit që kthehet në blu kur është aktive) në të gjithë këtë udhëzues.
- Nën atë, ka një linjë të thërrimeve të elementeve HTML që tregojnë vendndodhjen e elementit të zgjedhur aktualisht.
- Paneli nën kërkesat e lundrimit tregon pemën HTML ose "Pamjen e shënimit" të faqes në internet. HTML e elementit të zgjedhur do të shënohet dhe përqendrohet në këtë panel.
- Paneli në të djathtë shfaq fletën e stilit CSS të faqes aktuale të internetit.
Hapi 5. Zgjidhni një element tjetër
Kur shiriti i veglave është i hapur, lehtë mund të zgjidhni elementë të tjerë. Ka tre mënyra për ta bërë këtë:
- Rri pezull mbi një linjë HTML për të shënuar elementin e zgjedhur (kjo veçori kërkon Firefox 34+). Klikoni në HTML për të zgjedhur atë element.
- Klikoni mjetin "Zgjidh elementin" në këndin e majtë të shiritit të veglave: ai ka një ikonë në formë kursori mbi një kuti. Lëvizni kursorin në faqen e internetit për të shënuar një element dhe klikoni për ta zgjedhur atë.
Hapi 6. Gjurmoni kodin HTML
Klikoni kudo në panelin HTML. Përdorni tastet e drejtimit majtas dhe djathtas në tastierë për të kaluar nga kodi në kod (kjo veçori kërkon Firefox 39+). Kjo metodë është e dobishme për zgjedhjen e elementeve që janë shumë të vegjël për t'u zgjedhur me kursorin.
- HTML e thinjur tregon elemente që nuk shfaqen në faqe. Elementet e përfshira në këtë janë komente, si nyje, dhe elementë të tjerë të fshehur nga vetia e ekranit CSS.
- Klikoni shigjetën në të majtë të kutisë për të treguar ose fshehur përmbajtjen. Për të shfaqur të gjithë përmbajtjen, mbani shtypur alt="Image" ose opsionin ndërsa klikoni shigjetën.
Hapi 7. Gjeni elementin
Shikoni fushën e kërkimit (ikonë në formë loopi) në cepin e djathtë të rreshtit të thërrimeve të bukës. Klikoni për të zgjeruar fushën e kërkimit dhe shkruani kodin HTML që dëshironi të kërkoni. Ndërsa shtypni, do të shfaqet një dritare që shfaq rezultatet e kërkimit që përputhen. Klikoni një element nga rezultatet e kërkimit dhe lëvizni panelin HTML në kodin që po kërkoni.
Pjesa 2 nga 2: Redaktimi i HTML
Hapi 1. Ringarko faqen për të filluar nga e para
Nëse jeni i ri në mjetet e zhvillimit të faqes në internet, kini parasysh se nuk bëni ndryshime të përhershme në faqet që redaktoni. Ndryshimet tuaja shfaqen vetëm në ekranin tuaj derisa të ngarkoni ose mbyllni faqen. Ndjehuni të lirë të eksperimentoni edhe nëse nuk e dini se çfarë do të ndodhë.
Hapi 2. Klikoni dy herë në HTML për ta redaktuar
Klikoni dy herë në HTML në linjë. Shkruani tekstin e ri dhe shtypni enter për të ruajtur ndryshimet.
Hapi 3. Klikoni dhe mbani mjetin në thërrimet e bukës për të shfaqur më shumë opsione
Vini re se shiriti i veglave të bukës është midis pemës HTML dhe shiritit të veglave mbi të. Klikoni dhe mbani një mjet në këtë rresht për të hapur më shumë menu. Më poshtë është një aluzion i opsioneve në dispozicion (jo shterues):
- "Redakto si HTML" ju lejon të redaktoni të gjithë përmbajtjen HTML nga pema HTML drejtpërdrejt në vend që të redaktoni çdo rresht.
- "Copy Inner HTML" kopjon të gjithë përmbajtjen brenda nyjes, ndërsa "Copy Outer HTML" kopjon përmbajtjen dhe nyjet (të tilla si ose
- "Paste" sjell disa opsione se ku të ngjisni kopjen, të tilla si para nyjës ose pas fëmijës së parë të nyjës.
- : rri pezull,, aktiv dhe: fokusi ndryshojnë pamjen e elementit kur përdoruesi ndërvepron. Efektet e ndryshuara përcaktohen nga fleta e stilit CSS (E redaktueshme nga paneli në të djathtë).
Hapi 4. Zvarrit dhe lësho
Për të riorganizuar elementet në kod, klikoni dhe mbani HTML derisa të shfaqet një vijë me pika. Lëvizni vijën lart e poshtë pemës dhe lëshoni butonin e miut kur vija është aty ku dëshironi.
Kjo veçori kërkon Firefox 39 dhe më vonë
Hapi 5. Mbyll shiritin e veglave të zhvilluesit
Për të mbyllur të gjithë dritaren Inspect Element, klikoni butonin X në këndin e sipërm të djathtë të shiritit të veglave të vendosura mbi panelin CSS.
Këshilla
- Ju gjithashtu mund të hapni shiritin e veglave nga opsionet e menysë në krye të dritares:
- Windows: Firefox → Web Developer → Toggle Tools
- Mac ose Linux: Mjetet → Zhvilluesi i uebit → Ndryshimi i veglave
- Firefox 40 ka mundësinë të fshehë panelin CSS në mënyrë që të keni më shumë hapësirë për të redaktuar HTML. Shikoni për ikonën e shigjetës në këndin e djathtë të rreshtit të thërrimeve të bukës dhe në të djathtë të fushës së kërkimit. Klikoni këtë ikonë për të fshehur panelin CSS dhe klikoni përsëri për ta shfaqur atë.
- Ju gjithashtu mund të redaktoni panelet CSS, por ato nuk janë të listuara në këtë artikull. Ju mund të gjeni udhëzime për redaktimin e kodit CSS në internet.