Izstrādātāji un lietotāja interfeisa dizaineri izmanto funkciju Pārbaudīt elementu, lai tiešsaistē modificētu vietnes, nemainot avota kodu. Bet kā pārbaudīt elementus, neapmeklējot tīmekļa izstrādes kursu?
Inspect Element ir ērts izstrādātāja rīks, kas ir pieejams kopā ar populārām tīmekļa pārlūkprogrammām. Pārlūkojot vietnes, jums vienkārši jāzina, kā ar dažiem klikšķiem izvietot rīku.
Varat veikt daudzus burvju trikus, piemēram, mainīt vietnes izkārtojumu, uzņemt ekrānuzņēmumus bez teksta, mainīt fontus, mainīt skaitļus un daudz ko citu.
Tālāk atrodiet īsu, soli pa solim sniegtu rokasgrāmatu, lai uzzinātu, kā bez pūlēm pārbaudīt elementus.
Kas ir pārbaudes elements?
Inspect Element ir tīmekļa izstrādes rīks, kas pieejams lielākajā daļā tīmekļa pārlūkprogrammu. Varat to izmantot, lai rediģētu jebkuras apmeklētās vietnes priekšgala avota kodu.
Izmaiņas, ko veicat, tiek veiktas tīmekļa pārlūkprogrammas smilšu kastē. Tātad jūs neveiksit nekādas izmaiņas faktiskajā vietnē. Arī virspusējās izmaiņas, ko veicat, pazūd, atsvaidzinot lapu.
Šeit ir daži radoši veidi, kā to izmantot:
- Jums ir jāuzņem ekrānuzņēmums no vietnes, un attēlā redzamie teksti jūs satrauc. Izmantojiet rīku Pārbaudīt elementu, lai izdzēstu šos tekstus.
- Jūs vēlaties izjokot savus draugus, parādot viņiem savu vārdu New York Times vai Washington Post. Pārbaudīt elementu ir labākais veids, kā to izdarīt.
- Pārbaudiet atkļūdošanas kodus vietnēs, piemērojot tos reāllaikā, izmantojot rīku Inspect Element. Ja tas darbojas, varat mainīt aizmugursistēmas avota kodu.
- Kā digitālā mārketinga speciālists varat atklāt konkurentu atslēgvārdus, SEO nosaukumus, metatagus utt., izmantojot šo vareno tīmekļa izstrādes rīku.
Kā pārbaudīt elementus sistēmā Windows
Pārbaudes elementa rīka izmantošana operētājsistēmā Windows ir smieklīgi vienkārša. Tālāk atrodiet detalizētu ceļvedi, lai pārbaudītu elementus, izmantojot dažādas Windows tīmekļa pārlūkprogrammas.
Google Chrome pārbaudes rīks
- Lietojot Google Chrome, ar peles labo pogu noklikšķiniet jebkurā tīmekļa vietnē.
- Ar peles labo pogu noklikšķiniet uz konteksta izvēlnes.
- Apakšdaļā jūs redzēsit Pārbaudīt.
- Klikšķis Pārbaudīt lai skatītu HTML un CSS kodus a labās puses panelis.
Kā pārlūkā Chrome atvērt pārbaudes elementu, nenoklikšķinot ar peles labo pogu?
Ir daži ērti saīsnes, lai atvērtu rīku Pārbaudīt elementu pārlūkprogrammā Google Chrome operētājsistēmai Windows. Šie karstie taustiņi ir šādi:
- Ctrl + Shift + C
- Funkciju taustiņš F12
Iepriekš minētie karstie taustiņi darbojas arī pārlūkprogrammā Mozilla operētājsistēmai Windows.
Mozilla inspektora rīks
Pārlūkprogrammā Mozilla process ir tāds pats kā Google Chrome. Tomēr inspektors logs tiks parādīts pārlūkprogrammas apakšā, nevis labajā pusē, kā tas ir Google Chrome.
Microsoft Edge pārbaudes rīks
Pārsteidzoši, ka Microsoft Edge pārbaudes elements darbojas līdzīgi kā pārlūkprogramma Google Chrome. Pārbaudes rīks ir pieejams, noklikšķinot ar peles labo pogu. Arī HTML un CSS kodi tiek parādīti labajā pusē, līdzīgi kā Google Chrome.
Kā pārbaudīt elementus operētājsistēmā Mac
Vai Apple Mac datoros izmantojat pārlūkprogrammu Google Chrome, Mozilla Firefox vai Microsoft Edge? Ja jā, varat izvietot Inspect Element rīku, veicot iepriekš Windows sadaļā minētās darbības.
Bet, ja izmantojat noklusējuma macOS tīmekļa pārlūkprogrammu Safari, rīka Inspect Element izmantošana ir sarežģīta spēle. Pēc noklusējuma Safari nerāda Inspect Element operētājsistēmā Mac. Lūk, kas jums jādara:
Kā atvērt pārbaudes elementu operētājsistēmā Mac
Vispirms Mac datorā ir jāaktivizē izstrādātāja rīki Safari. Lūk, kā to izdarīt:
- Skrien uz Safari pārlūks.
- Apmeklējiet vietni, kurā vēlaties pārbaudīt tīmekļa elementus.
- Izvēlieties Safari no pārlūkprogrammas Safari augšējās izvēlņu joslas.
- Klikšķis Preferences no atvērtās konteksta izvēlnes.
- Uz Preferences ekrāns, atlasiet Papildu.
- Atzīmējiet Rādīt Izstrādāt izvēlnes apakšdaļā Papildu preferences ekrāns.
Jūs esat veiksmīgi iespējojis izstrādātāja rīkus pārlūkprogrammā Safari for Mac. Tagad veiciet šīs darbības, lai izmantotu pārbaudes elementu:
- Jebkurā vietnes elementā, piemēram, tekstā vai attēlā, ar peles labo pogu noklikšķiniet.
- Parādīsies konteksta izvēlne. Apakšdaļā jūs redzēsit Pārbaudiet elementu.
- Noklikšķiniet uz tā, lai zem vietnes atvērtu atkļūdošanas sadaļu, kurā tiek rādīts HTML un CSS kodiem.
Kādas ir pārbaudes elementa atslēgas?
Iespējams, jūs meklējat saīsnes Inspect Element operētājsistēmā Mac. Varat izmantot tālāk norādīto.
- Pavēli + Shift + C
- Nospiediet pogu Kontrole taustiņu un pēc tam atlasiet jebkuru elementu.
- Noklikšķiniet uz skārienpaliktņa ar diviem pirkstiem
Kā pārbaudīt elementus Chromebook datoros
Chromebook dators izmanto Google Chrome kā noklusējuma pārlūkprogrammu. Tāpēc pēc jebkuras vietnes atvēršanas vienkārši ar peles labo pogu noklikšķiniet, lai nākamajā konteksta izvēlnē atrastu opciju Pārbaudīt elementu.
Ja izmantojat Chromebook datoru no darba vai skolas, iespējams, uzdodat šo jautājumu:
Kāpēc es nevaru pārbaudīt skolas Chromebook datoru?
Lielākā daļa skolu un uzņēmumu administratoru atspējo papildu funkcijas jūsu nodrošinātajā Chromebook datorā darbam vai mācībām. Tā kā izstrādātāju rīki ir uzlabotas funkcijas, iespējams, ka jūsu skolas vai darba Chromebook datorā netiks rādīts rīks Inspect Element.
Kā pārbaudīt elementus iPad/iPhone
Diemžēl jūs nevarat izmantot Inspect Element rīku iPhone vai iPad bez Mac.
iOS un iPadOS ir Web Inspector lietotnei Safari. Tomēr tas darbojas tikai tad, ja savienojat mobilo ierīci ar Mac datoru, kurā jau esat aktivizējis izstrādātāja rīkus programmai Safari. Tālāk ir norādītas darbības, kuras varat izmēģināt.
- Atveriet iPad/iPhone Iestatījumi lietotne.
- Klikšķis Safari kreisās puses navigācijas rūtī.
- Pēc tam ritiniet uz leju labajā pusē, lai atrastu un atlasītu Papildu.
- Aktivizējiet slēdzi uz Tīmekļa inspektors.
- Tagad savienojiet mobilo ierīci ar Mac, izmantojot USB.
- Autorizējiet iPhone/iPad operētājsistēmā Mac.
- Atveriet jebkuru vietni mobilajā ierīcē pārlūkprogrammā Safari.
- Tagad Mac datorā palaidiet Safari un atlasiet Attīstīt augšējā izvēlņu joslā.
- Atvērtajā konteksta izvēlnē meklējiet savas mobilās ierīces nosaukumu.
- Novietojiet kursoru virs mobilās ierīces, lai skatītu visas atvērtās vietnes.
- Tagad atlasiet jebkuru vietni, lai skatītu HTML un CSS avota kodu Mac pārlūkprogrammā Safari.
Secinājums
Jūs esat izpētījis visus iespējamos veidus, kā izmantot rīku Pārbaudīt elementu pagaidu tīmekļa lapu rediģēšanai. Jūs esat arī iemācījies pārbaudīt elementus dažādām ierīcēm, piemēram, Mac, Windows, Chromebook, iPad un iPhone.
Nākamreiz, kad izklaidei vai profesionālām vajadzībām būs jāmaina tīmekļa lapa, izmēģiniet šīs metodes. Jums noteikti patiks šīs vienkāršas darbības, nevis citas sarežģītas metodes, kas aprakstītas citur.
Neaizmirstiet tālāk atstāt komentārus, ja iepriekš minētās darbības jums palīdzēja, kāda metode, kas jums šķiet sarežģīta, vai kādi slepeni padomi par rīku Pārbaudīt elementu.
Vai nepieciešama tīmekļa lapa kā drukāta atsauce? Uzziniet, kā ātri saglabājiet tīmekļa lapu kā PDF tagad!