© 2016, Mike Murach & Associates, Inc. Chapter 3 © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

© 2016, Mike Murach & Associates, Inc. Objectives © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

© 2016, Mike Murach & Associates, Inc. Objectives (cont.) © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The user interface for the Future Value application © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The HTML that’s generated for a new form © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The HTML after it has been modified for this application © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The aspx code for the Future Value application © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The aspx code for the Future Value app (cont.) © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The aspx code for the Future Value app (cont.) © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The aspx code for the Future Value app (cont.) © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The external style sheet for the Future Value application © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The external style sheet (cont.) © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The external style sheet (cont.) © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

© 2016, Mike Murach & Associates, Inc. Common HTML elements © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

How to code HTML elements © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

How to code the attributes for HTML elements © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

How to code an HTML comment © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The primary HTML5 semantic elements © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

A page that’s structured with header, main, and footer elements © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The page displayed in a web browser © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The div and span elements © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The way div elements were used before HTML5 © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

Span elements in the HTML for a JavaScript application © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

© 2016, Mike Murach & Associates, Inc. Span elements generated by ASP.NET for two validators and a label control © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

Three ways to provide styles © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

Three ways to provide styles (cont.) © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

A head element that includes two external style sheets © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

How to generate a link element for an external style sheet © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

HTML that can be selected by type, class, or id © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

Three rule sets with type selectors © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

Two rule sets with class selectors © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The elements displayed in a browser © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

© 2016, Mike Murach & Associates, Inc. Some of the styles in the external style sheet for the Future Value application © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

Some of the styles for the Future Value app (cont.) © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The current browsers and their HTML5 ratings (perfect score is 555) © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The code that includes the JavaScript shiv for HTML5 compatibility © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The URL for downloading the normalize.css style sheet © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

IntelliSense as an HTML element is entered in Source view © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The smart indent feature © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

Other Video Studio features for entering HTML © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

© 2016, Mike Murach & Associates, Inc. Types of disabilities © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

IntelliSense with a list of WAI-ARIA values © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

An external style sheet in Visual Studio © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

How to create an external style sheet © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

How to enter and edit the styles for an external style sheet © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

How to comment out and uncomment CSS rules © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The responsive Future Value application at desktop width © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The responsive Future Value application at tablet width © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The responsive Future Value application at smart phone width © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The NuGet Package Manager page © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

How to add the Bootstrap Nuget package to your web application © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

How to add Bootstrap to a web form © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

Some of the CSS classes of the Bootstrap grid system © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

An element that spans four columns on medium and large screens © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

A Bootstrap grid on a medium screen © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

A Bootstrap grid on a small screen © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

A Bootstrap grid on an extra small screen © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The HTML for the grid example © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The CSS that augments the Bootstrap CSS classes © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

Some of the Bootstrap CSS classes for working with forms © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

A form with two text boxes in vertical layout © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

A form with two text boxes in horizontal layout © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

Some of the Bootstrap CSS classes for working with buttons © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

A form with a jumbotron, an image, and two buttons © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

© 2016, Mike Murach & Associates, Inc. The HTML for the form © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The aspx code for the Future Value application © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The aspx code for the Future Value app (cont.) © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The aspx code for the Future Value app (cont.) © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The aspx code for the Future Value app (cont.) © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The aspx code for the Future Value app (cont.) © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

The custom style sheet for the Future Value application © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015

Extra 3-1 Use CSS and Bootstrap to format the Quotation application © 2016, Mike Murach & Associates, Inc. Murach's ASP.NET 4.6 with C# 2015