Si të përdorni elementin e inspektimit në Mozilla Firefox: 12 hapa

Përmbajtje:

Si të përdorni elementin e inspektimit në Mozilla Firefox: 12 hapa
Si të përdorni elementin e inspektimit në Mozilla Firefox: 12 hapa

Video: Si të përdorni elementin e inspektimit në Mozilla Firefox: 12 hapa

Video: Si të përdorni elementin e inspektimit në Mozilla Firefox: 12 hapa
Video: Как избежать появления трещин на стенах? Подготовка под штукатурку. #11 2024, Nëntor
Anonim

"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

Përdorni elementin Inspect në Mozilla Firefox Hapi 1
Përdorni elementin Inspect në Mozilla Firefox Hapi 1

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"

Përdorni elementin Inspect në Mozilla Firefox Hapi 2
Përdorni elementin Inspect në Mozilla Firefox Hapi 2

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ë.

Përdorni elementin Inspect në Mozilla Firefox Hapi 3
Përdorni elementin Inspect në Mozilla Firefox Hapi 3

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.

Përdorni elementin Inspect në Mozilla Firefox Hapi 4
Përdorni elementin Inspect në Mozilla Firefox Hapi 4

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.
Përdorni elementin Inspect në Mozilla Firefox Hapi 5
Përdorni elementin Inspect në Mozilla Firefox Hapi 5

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ë.
Përdorni elementin Inspect në Mozilla Firefox Hapi 6
Përdorni elementin Inspect në Mozilla Firefox Hapi 6

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.
Përdorni elementin Inspect në Mozilla Firefox Hapi 7
Përdorni elementin Inspect në Mozilla Firefox Hapi 7

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

Përdorni elementin Inspect në Mozilla Firefox Hapi 8
Përdorni elementin Inspect në Mozilla Firefox Hapi 8

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ë.

Përdorni elementin Inspect në Mozilla Firefox Hapi 9
Përdorni elementin Inspect në Mozilla Firefox Hapi 9

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.

Përdorni elementin Inspect në Mozilla Firefox Hapi 10
Përdorni elementin Inspect në Mozilla Firefox Hapi 10

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ë).
Përdorni elementin Inspect në Mozilla Firefox Hapi 11
Përdorni elementin Inspect në Mozilla Firefox Hapi 11

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ë

Përdorni elementin Inspect në Mozilla Firefox Hapi 12
Përdorni elementin Inspect në Mozilla Firefox Hapi 12

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.

Recommended: