Watch videos with subtitles in your language, upload your videos, create your own subtitles! Click here to learn more on "how to Dotsub"

Visual Studio vNext Videos: Page Inspector - Decomposing your Web Application

0 (0 Likes / 0 Dislikes)
  • Embed Video

  • Embed normal player Copy to Clipboard
  • Embed a smaller player Copy to Clipboard
  • Advanced Embedding Options
  • Embed Video With Transcription

  • Embed with transcription beside video Copy to Clipboard
  • Embed with transcription below video Copy to Clipboard
  • Embed transcript

  • Embed transcript in:
    Copy to Clipboard
  • Invite a user to Dotsub
[Microsoft ASP.net] [www.ASP.net] [ASP.NET & Visual Studio vNext Preview] [Jorge Gabuardi Gonzalez] The upcoming version of Visual Studio introduces a number of improvements for diagnosing your web application. One of these improvements is the Page Inspector. [Page Inspector - Part 2: Decomposing your Web Application] In this next video we will see how to use the Page Inspector to decompose and troubleshoot your web application. I have to right click on the project and select View in Page Inspector. For this example, we want to fix the unmatching menu item and we want to change the color for the template's headers. After entering Inspect mode, I need to hover over the element that needs to be fixed. Since I now have the source file in the exact location where the DOM element was generated, I can see that it is missing an li tag. As I'm making changes in the file, Page Inspector will provide feedback about the browser and the source code being out of sync. When the Page Inspector notifies that the browser and the source code are out of sync, we can use the hot key Control-Alt-Enter to save all the files and refresh the browser without ever leaving the editor. For the second task, let's inspect the headers in the template. Using the CSS tools, we can change the color property value until we find the value that we find suitable. Clicking on the rule will open the CSS file with the rule selected for faster interaction. Just like we did before, we should use the key combination Control-Alt-Enter to save the file and refresh the browser with the latest. Finally, you can use the Files tab to see all the files that compose the current web page. [Microsoft ASP.net] [www.ASP.net]

Video Details

Duration: 1 minute and 56 seconds
Country: United States
Language: English
License: All rights reserved
Genre: None
Views: 6
Posted by: neudesicasp on Sep 27, 2013

In this video, Jorge Gabuardi Gonzalez shows how to use the Page Inspector in Visual Studio vNext to troubleshoot HTML and styles in your ASP.NET applications.

Caption and Translate

    Sign In/Register for Dotsub to translate this video.