Dodaci za preglednik Firefox
  • Proširenja
  • Teme
    • za Firefox
    • Rječnici i jezični paketi
    • Druge stranice preglednika
    • Dodaci za Android
Prijavi se
Pregled za devtools-highlighter

devtools-highlighter od Patrick Brosset

Find and highlight elements on the page with this DevTools panel, using CSS styles and selectors.

4.8 (6 reviews)4.8 (6 reviews)
96 Users96 Users
Za korištenje ovog proširenja trebat ćeš Firefox
Preuzmi Firefox i nabavi proširenje
Preuzmi datoteku

Metapodaci proširenja

Snimke ekrana
Informacije o ovom proširenju
There are 2 ways to find elements using the panel:

- By using computed style queries.
- Or by using CSS selectors.

Using computed style queries

This is the main feature of this extension. It is very useful for finding elements on a page that have certain CSS computed styles.

For example, say you want to list all of the CSS grids on a page. You can use this query to do this display:grid.

The extension will simply loop through all elements on the page and only display the ones that do have their CSS computed display value set to grid.

You can also use a couple of operators to make searching more useful:

display:!block will find all elements that have a display value other than block.

display:~flex will find all elements that have a display value that includes the substring flex. So it will match elements that have it set to inline-flex and flex.

The extension also supports descendant queries. That means you can find elements that have a given style and that are descendant of elements that have another given style.

For instance display:flex align-self:start will find all elements with align-self set to start and that are descendants of a display:flex element.

Using CSS selector queries

This is a more traditional way to search for elements in the page but can be useful too.

With this feature, you can simply type any CSS selector that would work with document.querySelectorAll and the matching elements will be listed and highlighted.

Browsing the results

Once a search has returned results, they are displayed in the panel and they are all highlighted in the page too.

Hovering over a single result will highlight only the corresponding element.

It is also possible to scroll an element into view by clicking on the corresponding link in the panel.

Finally, you can also select any of the displayed elements in the inspector panel by clicking on the select link in the panel.
Komentari razvijatelja
This is the result of a couple of hours of work only. This is therefore experimental. Feel free to report issues on the GitHub issue tracker.
And let me know what you think in the comments!
Rated 4,8 by 6 reviewers
Prijavi se i ocijeni ovo proširenje
Još nema ocjena

Ocjena je spremljena

5
5
4
1
3
0
2
0
1
0
Pročitaj 6 recenzija
Dozvole i podaciSaznaj više

Potrebne dozvole:

  • Rasklopiti programerske alate za pristupanje podacima u otvorenim karticama
  • Pristupiti tvojim podacima za sve web stranice
Daljnje informacije
Poveznice dodatka
  • Početna stranica
  • Stranica podrške
Verzija
1.2.1resigned1
Veličina
19,81 KB
Zadnje aktualiziranje
prije godinu (25. tra. 2024)
Povezane kategorije
  • Razvoj weba
  • Ostalo
Licenca
Mozilla javna licenca 2.0
Povijest verzija
  • Pogledaj sve verzije
Dodaj u zbirku
Prijavi ovaj dodatak
Daljnja proširenja od Patrick Brosset
  • Još nema ocjena

  • Još nema ocjena

  • Još nema ocjena

  • Još nema ocjena

  • Još nema ocjena

  • Još nema ocjena

Idi na početnu stranicu Mozille

Dodaci

  • Informacije
  • Blog za Firefox dodatke
  • Radionica za proširenja
  • Centar za programere
  • Pravila za programere
  • Blog zajednice
  • Forum
  • Prijavi grešku
  • Priručnik za recenziranje

Preglednici

  • Desktop
  • Mobile
  • Enterprise

Proizvodi

  • Browsers
  • VPN
  • Relay
  • Monitor
  • Pocket
  • Bluesky (@firefox.com)
  • Instagram (Firefox)
  • YouTube (firefoxchannel)
  • Privatnost
  • Kolačići
  • Pravne informacije

Osim gdje je drugačije navedeno, sadržaj ove stranice licenciran je pod licencom Creative Commons Imenovanje dijeli pod istim uvjetima verzija 3.0 ili novijoj.