html转cshtml 基础篇

前往通用篇

工具:一个html页面、VS2019、一个MVC项目

一、将所有的css样式包含在项目中

Content文件夹->右键->添加现有项->选择html页所有css样式

可能遇到的问题

解决办法

如果是项目自带的文件，可以选择替换。如果是自定义的文件，需要重命名再添加进去。

二、同理，将所有的js文件包含在项目中

Scripts文件夹->右键->添加现有项->选择html页所有js文件

三、新建一个布局页

Views/Shared文件夹->右键->添加->MVC5布局页(Razor)

注意：这里不要选错，是布局页

创建完成后如下：

四、向布局页中添加css链接和js链接

五、在视图中把使用布局页并将内容填充

这里偷懒，用自带的Home下的Index.cshtml视图,然后将内容全部清空

输入标题并运用布局页

@{ViewBag.Title = "江西师范大学主页";Layout = "~/Views/Shared/text.cshtml";
}

填充内容

将原来html页的body标签的内容(除了script标签)全部复制，粘贴到下面

可能遇到的问题

解决方法

@的转义是@@

六、运行结果

到此，html正式转为MVC(cshtml）

附录

现在一个页面就需要一个布局页，或者你可能搭建了一个空的布局页，每个分布页中重复引入了相同的css、js文件，造成极大的代码冗余！
可以通过设计一个通用的布局页来减少这部分冗余。
当然，用的前端框架、技术不同，每个人都有不同的布局页，不过道理是一样的。
接下来，搭建一个可重用的布局页为例，在布局页中搭建bootstrap框架、Font Awesome字体库以及jQuery。

前往通用篇

End

html转cshtml 基础篇相关推荐

html转成cshtml通用篇
html转成cshtml通用篇问题描述:在基础篇中,已经成功将html转成cshtml页面,但是css文件.js文件却全部放在了布局页中,导致布局页无法重用. 接下来,搭建一个可重用的布局页,在布局 ...
Python Qt GUI设计：信号与槽的使用方法（基础篇—7）
目录 1.信号与槽的概念 2.信号与槽的基础函数 2.1.创建信号函数 2.2.连接信号函数 2.3.断开信号函数 2.4.发射信号函数 3.信号和槽的使用方法 3.1.内置信号与槽的使用 3.2.自 ...
Python Qt GUI设计：窗口布局管理方法【强化】（基础篇—6）
目录 1. 水平布局类(QHBoxLayout) 2.垂直布局类(QVBoxLayout) 3.网格布局类(QGridLayout) 3.1.单一的网络布局 3.2.跨越行.列的网络布局 4.表单布局 ...
Python Qt GUI设计：窗口布局管理方法【基础】（基础篇—5）
目录 1.布局管理器进行布局 2.容器控件进行布局 3.geometry属性:控件绝对布局 4.sizePolicy属性:微调优化控件布局 Qt Designer提供4种窗口布局方式,分别如下: Ve ...
ES6 你可能不知道的事 – 基础篇
ES6 你可能不知道的事 – 基础篇转载作者:淘宝前端团队(FED)- 化辰链接:taobaofed.org/blog/2016/07/22/es6-basics/ 序 ES6,或许应该叫 ES ...
python多线程并发_Python进阶记录之基础篇（二十四）
回顾在Python进阶记录之基础篇(二十三)中,我们介绍了进程的基本概念以及Python中多进程的基本使用方法.其中,需要重点掌握多进程的创建方法.进程池和进程间的通信.今天我们讲一下Python中 ...
基础篇9-python基本数据结构-列表
基础篇9-python基本数据结构-列表一.列表: 1.有序的集合 2.通过偏移来索引,从而读取数据 3.支持内嵌 a =[[1,2,3],[4,5,6]] 4.可变类型 a[0][1] = 7 二 ...
Linq初级班 Linq To XML体验(基础篇)
LINQ To XML体验(基础) 这两天开始学习LINQ to XML的知识,我会继续把自己的感想和示例发布给初学者们学习的,一样欢迎高手们多多指点,请勿使用过激语言,针锋相对,我是个初学者,自知还 ...
php 爬虫_Scrapy 爬虫完整案例-基础篇
1 Scrapy 爬虫完整案例-基础篇 1.1 Scrapy 爬虫案例一 Scrapy 爬虫案例:爬取腾讯网招聘信息案例步骤: 第一步:创建项目. 在 dos下切换到目录 D:爬虫_scriptsc ...
class括号里的object_Python入门类class 基础篇
记住一句话:类是模板,而实例则是根据类创建的对象. 我初学时对类的理解是从类的字面上,可以片面的认为它是一个种类,它是相似特征的抽像,也就是相似的东西,可以把相似特征的事务抽象成一个类.(事务可以是具 ...

html转cshtml 基础篇

html转cshtml 基础篇

工具:一个html页面、VS2019、一个MVC项目

一、将所有的css样式包含在项目中

Content文件夹->右键->添加现有项->选择html页所有css样式

可能遇到的问题

解决办法

二、同理，将所有的js文件包含在项目中

Scripts文件夹->右键->添加现有项->选择html页所有js文件

三、新建一个布局页

Views/Shared文件夹->右键->添加->MVC5布局页(Razor)

四、向布局页中添加css链接和js链接

五、在视图中把使用布局页并将内容填充

这里偷懒，用自带的Home下的Index.cshtml视图,然后将内容全部清空

输入标题并运用布局页

填充内容

可能遇到的问题

解决方法

六、运行结果

附录

html转cshtml 基础篇相关推荐

最新文章

热门文章