Package for HTML, CSS quick reference - visual-studio-code

I am learning HTML and CSS.
I hope to learn HTML, CSS, and Java fastly.
Do any packages that could show the additional reference link for properties?
Visual studio code:
Atom editor:

Packages for Atom Editor are
autoclose-html
emmet
csslint
atom-html-preview
Packages for Visual Studio Code
Html CSS Support
HTML Snippets
For js Quokka.js

Related

different languages with different syntaxcheck in same visual studio code file

Is it possible to have different syntax highlighting in different sections in the same file in visual studio code?
I mix classic asp, html and js in the same file.
in asp, everything after a single quote is a comment, in js it delimits a string.
Is there some way I can tel vscode that this part is asp, and this part is js?

Auto-suggestion HTML and CSS code without an extension in VS Code

I just installed Visual Studio Code. It works and suggests HTML and stylesheet and JavaScript as well, but what matters is that I didn't install any extension in Visual Studio Code, and it works well without HTML and JavaScript extension.
How does it work without any extension? Do I need to install an extension for this?
To answer it on Low-Level, VS Code is built on top of monaco-editor
As mentioned in its docs, it has below stuffs by default
Rich IntelliSense, Validation TypeScript, JavaScript, CSS, LESS, SCSS,
JSON, HTML
Refer: https://microsoft.github.io/monaco-editor/
Those shortcut features are built with https://emmet.io/
So, for working with basic web stuffs, you don't need an extension.

How to start creating a language extension for VS Code?

Pursuant to the discussion in Add XHTML support, I'd like to start creating an extension for Visual Studio Code which would implement support for XHTML. Which is HTML with XML syntax, so the the desired functionality is already (mostly?) implemented elsewhere – for XML and HTML languages, the latter having two extensions bundled with VS Code: html and html-language features. But it's disparate.
As the first step, should I clone the VS Code repo and delete everything except the two directories named html and html-language features? Or Language services for HTML? Or the latter and html from the former? Or start with html, make it work for XHTML and only then deal with language features?
Should the second step be just adding the extension(s) I'm developing on my computer to my installation of VS Code? The GUI seems to allow adding only extensions from the Visual Studio Marketplace. Is it the right solution to place the extensions under development into VS Code's directory for extensions (either directly or with symbolic links)? I'm on Manjaro Linux.
If you can offer any other helpful advice, I welcome it too.

How to I get Visual Studio Code to treat <webscript> the same way it treats <script>?

I’m working on HTML files which contain JavaScript inside <webscript> tags. Can I customize Visual Studio Code so that it treats these tags the same way it treats <script> tags, i.e. with syntax highlighting, etc.?
AFAIK, there is no direct way to customize this in Code. But you could write your own language configuration. A documentation with a sample file can be found at: https://code.visualstudio.com/api/language-extensions/language-configuration-guide
The most easiest way would searching for the default html language configuration copy this file and just edit the regex for script to support webscript, too. Should be this one on GitHub

Visual Studio Code suggestions and autoclose are not working

I have some issues with my Visual Studio Code. After installing a fresh copy of it, and cleaned all the items stored by it, the autoclose plugin, the suggestion plugins are not working at all. All autosuggestions are prefixed by the icon [abc], the wrench key or blank file.
List of my plugins:
Angular 2 TypeScript Emmet
Angular 2 TypeScript Test Snippets
Angular 2+ Snippets - TypeScript, Html, ngRx, Angular Flex Layout, Material & Testing
Angular Files
Angular CLI
Angular v4 TypeScript Snippets
Auto Close tag
Auto Import
Beautify
Beautify CSS/sass/scss/less
CSS Peak
Debugger for Chrome
File Peek
Find all references
Highlight matching taf
HTML CSS Support
IntelliSense for CSS class
JavaScript ES6 code snippet
JavaScript and TypeScript IntelliSense
JavaScript Snippet Pack
jQuery Code Snippets
jslint
Less IntelliSense
Path IntelliSense
PHP IntelliSense
Prettify JSON
Stylesheet Formatter
Twig
TWIG pack
And all of them looks like something is not working. Here are some example of this issue:
Thanks!