Sien die HTML en CSS van enige webbladsy
Die webwerf is gebou met kode lyne, maar die resultaat is spesifieke bladsye met beelde, video, lettertipes en meer. Om een van die elemente te verander of om te sien wat dit bestaan, moet jy die spesifieke kode van die kode vind wat dit beheer. Jy kan dit met 'n element inspeksie instrument.
Die meeste webblaaiers maak nie dat jy 'n inspeksie-instrument aflaai of 'n byvoeging installeer nie. In plaas daarvan laat hulle jou regs kliek op die bladsy element en kies Inspect of Inspect Element . Die proses kan egter 'n bietjie anders wees in u blaaier.
Ondersoek elemente in Chrome
Die nuutste weergawes van Google Chrome laat jou toe om die bladsy op 'n paar maniere te inspekteer, wat almal sy ingeboude Chrome DevTools gebruik:
- Regskliek op iets op die bladsy (of 'n leë area) en kies Inspect
- Voer die snelkoppeling Ctrl + Shift + I in
- Gebruik die Chrome-kieslys om toegang te verkry tot die Meer nutsprogramme> Ontwikkelaar se nutsprogramme
Die Chrome DevTools laat jou dinge doen soos om HTML-lyne maklik te kopieer of te wysig of elemente heeltemal te verwyder of te verwyder (totdat die bladsy herlaai word).
Sodra DevTools aan die kant van die bladsy oopgemaak het, kan jy verander waar dit geposisioneer is, druk dit uit die bladsy, soek na al die lêers van die bladsy, kies elemente van die bladsy vir spesifieke ondersoek, kopieer lêers en URL's en pas selfs 'n klomp aan. van die instellings.
Ondersoek elemente in Firefox
Soos Chrome, het Firefox 'n paar verskillende maniere om sy instrument oop te maak genaamd Inspekteur:
- Regskliek op 'n leë area op die bladsy of kies 'n element en kies Inspect Element
- Voer Ctrl + Shift + T of Ctrl + Shift + I met die sleutelbord in
- Klik in die Firefox-kieslys op Ontwikkelaar > Inspekteur
- In die kieslys kies Webontwikkelaar> Inspekteur
Soos jy jou muis oor verskeie elemente in Firefox beweeg, vind die Inspekteur-instrument outomaties die element se bronkode-inligting. Klik op 'n element en die "on-the-fly-soektog" sal stop en jy kan die element van die Inspekteursvenster ondersoek.
Klik met die rechtermuisknop op 'n element om al die ondersteunde kontroles te vind. Jy kan dinge doen soos om die bladsy te wysig as HTML, kopieer of plak binne- of buitenste HTML-kode, wys DOM-eienskappe, skermkiekie of vee die nodus uit, pas nuwe eienskappe toe, sien al die CSS van die bladsy en meer.
Inspekteer elemente in Opera
Opera kan ook elemente inspekteer, met die DOM Inspector tool wat identies is aan Chrome's. Hier is hoe om dit te bereik:
- Gebruik die sleutelbordkortpad Ctrl + Shift + I
- Navigeer na Kieslys> Meer nutsprogramme> Wys ontwikkelaarspyskaart en open die kieslys deur Menu> Ontwikkelaar> Ontwikkelaar
- Kies Inspect element in die regs-kieslys op enige element op die bladsy
Ondersoek elemente in Internet Explorer
'N Soortgelyke inspekteer element hulpmiddel, genoem Ontwikkelaar Tools, is beskikbaar in Internet Explorer:
- Druk F12 op die sleutelbord
- Gebruik die Tools> F12 Developer Menu opsie (druk Alt + X as jy nie die Tools- kieslys sien nie)
- Regskliek op die bladsy en klik Inspect Element
IE het 'n Select element- instrument in hierdie nuwe kieslys waarmee jy op enige bladsy-element kan klik om die HTML- en CSS-besonderhede te sien. U kan ook maklik element-verligting uitskakel / aktiveer terwyl u deur die DOM-Explorer- oortjie blaai.
Net soos die ander element inspekteur gereedskap in die bogenoemde blaaiers, kan jy in Internet Explorer elemente sny, kopieer en plak, asook die HTML wysig, eienskappe byvoeg, kopie-elemente met toegepaste style en meer.