Visual Studio is not autocompleating html attrinbutes like id, class, hreff - visual-studio

I am using Visual Studio version 1.74.2 and it is not auto-completing attributes.
I have used many extensions like intellisence, Auto Close Tag, HTML CSS Support.

look at the emmet configuration.
Go to settings, and type "emmet".
Example : Normally in your html you just have to type "link" and press enter

Related

How Visual Studio syntax highlight works?

When I create a tag 'style' in an aspx page, Visual Studio highligths code using css style syntax to highlights and formatting. When I create a tag 'script', Visual Studio does the same, but using javascript style syntax.
When I create a .scss file, Visual Studio has scss syntax. I created a new server control that processes SCSS, and I want that code wrote inside this server control use scss style syntax. How do I vinculate a certain tag to a certain syntax processor?
Ps.: I'm using Visual Studio 2017
Editors (and many editor related features) in VS rely on a Content Type which indicates the language they support. Most editors, like C# or VB, only work on a single Content Type.
The HTML and ASPX editors in Visual Studio (which are separate editors) identify certain patterns that indicate a different language is being used. It then creates multiple internal documents in memory (TextBuffers) with separate Content Types for each language identified. The language services for each of those can then be used to handle the language natively instead of HTML having to "know" all about CSS/JavaScript/anything else. For example:
<script> blocks or event handlers create a JavaScript buffer for the contents
<style> blocks or style= attributes create CSS buffers
Any of the <%-style ASP.NET nuggets create appropriate language buffers (C#/VB)
The # in Razor CSHTML files creates a C# buffer
etc
These nested TextBuffers are actually entire documents to make the language look right. For example, if I have:
<span style="color: blue;" />
The CSS buffer is an internal document that looks something like this:
/* BEGIN EXTERNAL SOURCE */
span {
color: blue;
}
/* END EXTERNAL SOURCE */
It's important to note that this is a complete and parseable CSS document, so the language service can work as normal for finding errors, giving IntelliSense, etc.
(And if you think the CSS buffer looks messy, you should see what happens for Razor or ASPX nuggets...)
The ASPX editor then uses the VS editor platform to coordinate projections between these buffers into the single view of what you see - a TextView. So it looks like a single document, but it's being handled internally as several different documents (TextBuffers), one per language.
Now, getting to your question: how can you make the ASPX editor support SCSS? Well, there are two parts to this:
First, the ASPX editor would need to know how to identify the SCSS region of the document. This might be <style type="text/scss"> or another indicator. This could even be done by writing an extension to the ASPX editor if it were extensible (the HTML editor is much more friendly to writing extensions).
Next, the ASPX editor would create the projection span. It would hand that off to the SCSS language service. The SCSS language service needs to know that it's in a projection, and generate all that extra stuff to make the syntax tree work. (Note: the SCSS language service in VS doesn't support this today.)
From then on, everything that happens in the SCSS region needs to be mapped between the TextView (where the cursor is in the document you see) to the SCSS-specific TextBuffer (where the cursor is in the in-memory document used by the language service). Again, today the SCSS LS does not take this scenario into account.
The best way to get this to be supported is to give feedback through the Visual Studio developer community. This feature is already on the backlog, but adding additional votes for it will help the team to prioritize the work.

Adding reusable interface or enum code snippets in VS Code/Visual Studio

How can I add reusable interface or enum code snippets in VS Code/Visual Studio like XCode? That is, when I wanna type the same enum code again in my file, it just loads instantly(using IntelliSense) from the snippets library and I can press enter key to load all that enum code again in my file. How can I do this in VS Code/Visual Studio?
I have done by referring this link https://code.visualstudio.com/docs/customization/userdefinedsnippets

How to locate style in Less file

I have noticed that web essentials for visual studio creates a .css.map file when compiling less. Does this mean it is possible to navigate from a selector in the css file back to the selector in the associated less file? If so how?
Yes, the idea of source maps is to map code or css from a compressed file back to the original uncompressed version.
Here is a good guide to using source maps in Chrome and Firefox.
An introduction to source maps
In VS 2013, if you enable LESS preview window, you can leverage Go To Definition command on a selector in preview to highlight the corresponding selector in LESS source. (via right-click context menu or press F12 in preview window -- see #809). When applicable, it will also load the #imported document, where the source is available.
On that note, there are precession issues with libsass' source-map. For that matter, it doesn't work well in SCSS editor.

Zen coding support for CSS in Web Essentials 2012 for Visual Studio

i'Ve installed web essentials 2012 for VS2012.
But it seems it doesen't support zen coding for css??
or am i missing something??
please help..
thanks.
Web Essentials only supports ZenCoding for HTML. I decided to wait with the CSS implementation because of the CSS editors rich Intellisense and snippet support. They would most likely conflict with ZenCoding
Here's a sample to try :
h1{Good Example}#test.classname+#sibling1{div sibling1 text}+#sibling2{div sibling2 text}+h2{header2 text}+ul>li>a[href="http://stackoverflow.com"]{stackoverflow link}^li>a[href="http://codeproject.com"]{codeproject link}
Hit [TAB] Key to Expand
Remember to hit [tab] key after typing the sample, to expand the zen code to real HTML.
The sample above will expand to the following:
It will render in the browser to look like this:

Visual Studio Blog

I want to write a blog and some of the blogs that I've seen on the Internet have code snippets in VB.NET or C# that look like the text in Visual Studio itself even with the colors.
Is there some sort of application or tool I can use to create code snippets that look like those other blogs.
google-code-prettify is a good one.
Also, SyntaxHighlighter looks great, but I haven't tried it myself. It has explicit support for VB.NET.
If you're using Windows Live Writer for a blog editor I recomend using "Paste from Visual Studio" (link). It's a great way of getting formatted code into your blog posts.
I use this site to convert my code to HTML-formatted text for my blog. Works nicely.
If you don't mind using another application, Notepad++ exports your files to HTML.
Just open your *.cs files and go to Plugins > NppExport > Export to HTML. Fonts and colors are preserved, as defined in your Notepad++ configuration.
FYI, Notepad++ exports to HTML 4.01

Resources