1. Building CSS in Visual Studio 2013

2. Slide 2 Introduction Using the different HTML (and other) Visual Studio Editors CSS tools

3. Slide 3 Visual Studio Editors Visual Studio supports different editors designed to work with specific types of files Now there are different editors that can be used with.aspx files (Web Forms), and Razor files

4. Slide 4 Visual Studio Editors (List) Web Forms – Use to edit.aspx files I suggest that you use the Web Forms editor in this class HTML – Newer edito to use with Razor files (vb and cs) As you can see, there are others

5. Slide 5 Visual Studio Editors (Selecting) To apply a default editor for a file type or to select an editor: Right click the file in the Solution Explorer and click Open With

6. Slide 6 Visual Studio CSS Tools CSS is CSS but Visual Studio provides tools to Associate Web Forms and other files with a shared style-sheet. The tool is just editing the file and adding a link tag as you saw in IS 360 Create custom CSS styles and apply them to a shared stylesheet or embedded style sheet

7. Slide 7 Adding a Style Sheet Add a Style Sheet by clicking Web Site, Add New Item, and select Style Sheet Give the style sheet a name.

8. Slide 8 Associating a Web Form with a Style Sheet You could just write the tag or have Visual Studio do it for you With the Visual Studio designer in Design mode, click Format, Attach Style Sheet The following dialog will appear listing the style sheets that are part of the project

9. Slide 9 Adding A Style The Web form must be in Design mode Click Format, New Style The top section is used to define the selector Where the style is places (stylesheet, embedded) And the URL for external styles The bottom section defines the styles

10. Slide 10 Adding a Style (Illustration)