Highlighting kills the Razor syntax in Visual Studio 2010

asp.net-mvc-4razorsyntax highlightingthemesvisual studio 2010

I'm using Expression theme in Visual Studio 2010 Ultimate on Windows 7 operating system. (Note: Actually, I'm not sure this problem occurs because of the dark theme) A few days ago, I decided to learn ASP.NET MVC 4 and tried to create a small web application. In Visual Studio, I followed this instruction and created a new asp.net mvc 4 web application: File->New->Project->ASP.NET MVC 4 Web Application.

Everything was perfect. But when I opened the Login.cshtml file, I couldn't even see the razor syntax (expressions which started @) because of highlighting. Take a look:

enter image description here

Even if I select all the text with CTRL + A in Visual Studio, I barely see the syntax.

enter image description here

Because of that, I can't even start to learn asp.net mvc. I started to look for a solution for this situation on the internet, but I couldn't find any useful answer. In Visual Studio, I looked the Tools->Option->Font and Colors option, but I couldn't find anything for this either. This problem shows only when I'm working in a View (for the Razor). There is no highlighting problem in Model, Controller or any other code files.

User ray247 asked a question close enough to my question called Where can I change the Asp.net MVC 3 Razor syntax hightlighting in VS10? but I still can't find a solution. I don't want to stop using my dark theme. It's really good for my eyes.

Best Answer

You should be able to change the text background for Razor code by:

  1. Opening Visual Studio Options (Under Tools -> Options),
  2. Selecting "Fonts and Colors" (Under Environment in the treeview at left)
  3. Changing the dropdown box at top to "Text Editor" (if that isn't the value already),
  4. Choosing "Razor Code" from the "Display Items" listbox, and
  5. Changing the background color to your liking and clicking "OK" to apply the change.

There's also an "HTML Server-Side Script" setting that controls the background color of the Razor code delimiters (the @ expression and similar expressions that mark the beginnings of code blocks.)

HTH,
Clay