You’re debugging a problem on your own website where an incorrect font is being used, perhaps because of a font fallback issue or a missing glyph.You’re browsing a nicely designed website and want to find out which font the site uses.So, if you find the text in DevTools too small to read, click anywhere in DevTools to make sure the focus is there, and then press Ctrl+ (or Cmd+ on macOS). And just like any other web content in browsers, it can be zoomed in or out by using the Ctrl+ and Ctrl- keyboard shortcuts (or Cmd+ and Cmd- on macOS). Well, it turns out you can actually zoom into the DevTools UI.ĭevTools’ user interface is built with HTML, CSS, and JavaScript, which means that it’s rendered as web content by the browser. I know I’m not alone here, judging by the number of people who ask our team how to make them bigger! If you’re like me, you may find the text and buttons in DevTools too small to use comfortably. Let’s count down, starting with… 15: Zoom DevTools If there are other tips that you love and that make you more productive, consider sharing them with our community in the comments section! So, here are the top 15 most popular DevTools tips from the website. I recently started tracking the most popular tips that people are accessing on the site, and I thought it would be interesting to share some of this data with you! More and more tips get added over time, and traffic keeps growing. This is unfortunate as there are dozens of panels and hundreds of features available in DevTools across all browsers, and even the less popular ones can be quite useful when you need them.Īs it turns out, I’ve maintained the DevTools Tips website for the past two years now. When it comes to browser DevTools, we all have our own preferences and personal workflows, and we pride ourselves in knowing that “one little trick” that makes our debugging lives easier.īut also - and I know this from having worked on DevTools at Mozilla and Microsoft for the past ten years - most people tend to use the same three or four DevTools features, leaving the rest unused. Let’s discover the most popular DevTools tips that can boost your productivity. You might think you know all the tricks when it comes to browser DevTools, but did you know that there are dozens of panels and hundreds of features waiting to supercharge your debugging workflow? Whatever your debugging use case is, there’s probably a tool that’s right for the job.
0 kommentar(er)
