c# web app美化工作美化工作css框架更改cshtml中位置网上的bootstrap模板资源1 .从网站下载模板2 .使用模板的更多资料
美化工作
默认情况下,您了解MVC框架的概念和使用方式。 本文仅介绍如何基于MVC轻松美化
cshtml中css框架更改css的位置
想必熟悉html语言的人都知道,css一般写在脑子里,也就是head/head所在的位置,cshtml也是如此。
请看MVC框架中_Layout.cshtml的第7、8行。 这两行实际上指定了此web app使用什么样的css模板。
link rel=' style sheet ' href='~~/lib/bootstrap/dist/CSS/bootstrap.min.CSS '/link rel=' style sheet ' href
bootstrap.min.css高级bootstrap.css是一个类似于bootstrap.min.css可视化的文件。
你可以这样理解:
bootstrap.min.css是给机器看的。 bootstrap.css (未合成,看起来很难)是编译器翻译bootstrap.min.css的内容后展示的。 如果Bootstrap.min.css的内容发生变化,请查看bootstrap ) CSS bootstrap.css的内容
实际上,定义了许多预设参数,如开头的颜色。
如果想在普通的html中使用颜色,必须在网上查找与该颜色对应的代码(即,图中以#开头的数字)。
但是现在用对应颜色的英语就可以了,所以写html代码很方便。
如果想更改此模板,只需更改此处的内容。 但是作为初学者,我们可以直接使用网上的模板。
网上bootstrap模板资源以下是我找到的资源
3359 get.foundation/https://boots watch.com/https://materialize CSS.com/https://pure CSS.io/https://get bootstrap.com /以下
1 .从网站下载模板进入https://bootswatch.com/,然后单击导航栏中的“themes”
选择任意主题,点击“我选择的是journal”,显示以下画面
实际点击后出现的这个界面是使用journal模板后出现的效果的展示
下载此模板,点击下图所示位置
下载并获取bootstrap.min.css,将原始bootstrap.min.css更改为bootstrap-orign.min.css,然后将下载的bootstrap.min.css更改为www
此时,bootstrap.min.css将自动进入bootstrap.css。 此时,模板已成功下载到本地。
2 .有很多web容器通过模板展示在https://bootswatch.com/的支持页面上。 例如,下图导航页面
当您选择所需的导航页面并将鼠标移动到相应图标的右侧时,将显示图标。 点击图标,如下图所示
这是此模板下导航栏的源代码,实际上是通过cshtml控制网页的显示颜色。 位置的方法是每个东西的class名称。
例如,要更改导航栏的颜色,可以在nav class=后添加bg-dark和bg-white等属性。
这些属性在以前下载的bootstrap.min.css中定义
所以,如果以后要添加button等,可以在网站上确认相应的源代码,然后进行复制
可以看到更多的资料
3359 get bootstrap.com/docs/5.0/getting-started/introduction /