I am using Visual Studio Code and I really love this editor for working on HTML pages. Nevertheless I am looking for a way to jump to the corresponding CSS file when I select the class or id node. Did I miss something or is this still not working?
Allows Go to Definition from HTML to CSS / Sass / Less, provides Completion and Workspace Symbols for class & id name, and supports Find References from CSS to HTML. In a HTML document, choose Go to definition or Peek definition, the extension will search related CSS & Scss & Less selectors in current workspace folder.
Go To: jump directly to the css file or open it in a new editor ( F12) Hover: show the definition in a hover over the symbol ( Ctrl+hover) In addition, it supports the Symbol Provider so you can quickly jump to the right CSS/SCSS/LESS code if you already know the class or ID name
However, when you are working on a task, you will find yourself quickly jumping between the same set of files. VS Code provides two powerful commands to navigate in and across files with easy-to-use key bindings. Hold Ctrl and press Tab to view a list of all files open in an editor group.
– Édouard Lopez Mar 12 '21 at 14:41 Add a comment | 0 Features like this are implemented in extensions. So if the HTML support extension you have installed supports providing locations of CSS rules to Visual Studio then it will allow you to jump to that location. If not then not.
As @Mike said, try the CSS Peek extension, it does what you want nicely.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With