MVC cshtml如何使用css3

cshtml是C#版本的asp.net mvc页面后缀名，利用的是新一代页面视图引擎Razor，传统的aspx页面利用年夜量的办事器端控件衬着页面，cshtml则回归页面本真，没有办事器端控件，根基采用html原生语法，只是供给了一些简写体例罢了。

本文就为您介绍asp.net mvc的cshtml页面中若何利用css3

东西/原料

• visual studio 2017
• Framework 4.5+

方式/步调

1. 1

   1、新建asp.net mvc项目

        1）打开visual studio 2017（其他版本vs也是可以的）

        2）点击左侧顶部菜单【文件】->【新建】->【项目】

        3）在【新建项目】界面，依次选择【Web】->【ASP.NET Web 应用法式(.NET Framework)】，输入项目名称，选择【框架】为【.NET Framework 4.5】，点击【确定】

        4）在【新建应用法式】界面，依次选择【空】->【MVC(_M)】->【确定】

   
2. 2

   新建节制器与页面

        1）在【Controllers】文件夹上，右键选择【添加】->【节制器】，选择【MVC 5 Controller - Empty】，在弹出界面点窜节制器名称为【HomeController】，点击【添加】，节制器就建立完当作了

        2）在节制器的Index方式中，右键选择【添加视图】，在弹出窗口中去失落利用layout，点击【确定】，节制器对应的页面也建立好了

   
3. 3

   在Index.cshtml页面中利用css3的【圆角边框】，代码与演示如下

        1）以下的页面运行都是在visual studio的调试模式下打开浏览器执行的，若何将页面摆设到IIS，不是本文介绍的规模

        2）本文利用的css3都是以class体例进行演示，其他ID、DOM标签等只是点窜css的属性选择器，所以，不做冗余介绍  

   
4. 4

   在Index.cshtml页面中利用css3的【边框暗影】，代码与演示如下

   
5. 5

   在Index.cshtml页面中利用css3的【文本暗影】，代码与演示如下

   
6. 6

   在Index.cshtml页面中利用css3的【主动换行】，代码与演示如下