Ikusi edozein web orrialde HTML eta CSS
Webgunea kode lerroekin eraiki da, baina orrialde zehatzak irudiak, bideoak, letra tipoak eta gehiago ditu. Elementu horietako bat aldatzeko edo zer osatzen duten ikusteko, kontrolatzen duen kode lerro zehatz bat aurkitu behar duzu. Elementu ikuskatzeko tresna batekin egin dezakezu.
Nabigatzaile gehienek ez dute ikuskapen tresna bat deskargatzen edo gehigarri bat instalatu. Horren ordez, egin klik eskuineko botoiaz orrialdeko elementuarekin eta aukeratu Inspect edo Inspect Element . Hala ere, prozesua pixka bat desberdina izan daiteke arakatzailean.
Ikertu elementuak Chrome-n
Google Chrome-ren bertsio berrienak aukera ematen dizu orrialdea modu batzutan ikuskatu, horiek guztiak Chrome DevTools integratuak erabiltzen dituztelarik:
- Egin klik eskuineko botoiaz orrialdeko zerbait (edo zuriune bat ) eta hautatu Inspect
- Sartu Ctrl + Shift + I teklatu lasterbidea
- Erabili Chrome menua Gehiago tresnak> Garatzaileen tresnak aukera sartzeko
Chrome DevTools-ek gauza errazak kopiatzeko edo HTML lerroak editatzeko aukera ematen dizu, edo elementu guztiak ezkutatzeko edo ezabatzeko (orria berriro kargatzen).
Behin DevTools orriaren alboan irekita dagoenean, kokapenean bertan alda dezakezu, orrialdetik popatu, orrialdeen fitxategi guztiak bilatu, orrialdearen elementuak hautatzeko azterketa espezifiko, kopiatu fitxategiak eta URLak, eta baita sorta pertsonalizatu ere ezarpenak.
Inspect Elements in Firefox
Chrome bezalakoak, Firefoxek hainbat modu ditu bere ikuskatzailea izeneko tresna irekitzeko:
- Egin klik eskuineko botoiarekin orrialdeko eremu huts bat edo aukeratu elementu bat eta hautatu Inspect Element
- Sartu Ktrl + Shift + T edo Ktrl + Shift + I teklatuarekin
- Firefox menuan, sakatu Garatzailea > Ikuskatzailea
- Tresnak menuan, sakatu Web Developer> Inspector
Sagua hainbat elementutan zehar mugitzen duzunean, Inspector tresnak automatikoki aurkituko du elementuaren iturburu-kodea. Egin klik elementu bat eta "itsatsi bilaketa" gelditu egingo da eta elementua aztertzeko Inspector leihoan.
Egin klik eskuineko botoiarekin elementu bat onartutako kontrol guztiak aurkitzeko. Orrialde hau HTML gisa editatu ahal izango duzu, kopiatu edo itsatsi HTML kode barrukoa edo kanpora, erakutsi DOM propietateak, pantaila edo ezabatu nodoa, atributuak aplikatu erraz, ikusi orriko CSS guztiak eta askoz gehiago.
Inspect Elements in Opera
Opera elementuak ere ikuskatu ahal izango ditu, DOM Inspector tresnaren bidez, Chrome-ren berdinak direnak. Hona hemen nola iritsi:
- Erabili lasterbideen tekla Ctrl + Shift + I
- Nabigatu Menua> Tresnak> Erakutsi garatzailea menuan , eta, gero, menua ireki Menua> Garatzailea> Garatzaile tresnak
- Egin klik eskuineko botoiaz orrialdeko edozein elementuren menuan, aukeratu Ikuskatu elementua
Inspira Elementos en Internet Explorer
Ikertutako beste elementu batzuen tresna, Garatzailea tresnak izenekoa, eskuragarri dago Internet Explorer-en:
- Sakatu F12 teklatuan
- Erabili Tresnak> F12 Garatzaileen menua aukeran (sakatu Alt + X Tresnak menuan ikusten ez baduzu)
- Egin klik eskuineko botoiarekin orriaren gainean eta egin klik Inspect Element botoian
IEk aukeratutako elementu tresna bat du menu berri honetan, edozein elementu orrietan klik egin ahal izateko HTML eta CSS xehetasunak ikusteko. Elementu nabarmenak ere gaitu / gaitu DOM Explorer fitxan arakatzen ari zaren bitartean.
Aurreko arakatzaileetako beste elementu-ikuskatzaileen tresnak bezala, Internet Explorer-ek elementuen moztu, kopiatu eta itsasteko aukera ematen du, baita HTML editatu ere, atributuak gehitu, erantsitako estiloekin kopiatu elementuak eta askoz gehiago.