css - css 文件中的更改未反射(reflect)在 ASP.NET MVC 中的 View 中

标签 css asp.net-mvc

我在 css 文件中所做的更改没有反射(reflect)在 View 中。观点保持不变。我认为这可能是由于浏览器缓存造成的，并尝试使用 F5 进行刷新。即使那样它也不起作用。我从 _Layout.cshtml 中删除了 @Styles.Render("~/Content/css") 并且它也删除了已经剩余的样式。因此，我认为捆绑工作正常。这里有什么问题？帮我把 Index.cshtml 中的 h1 变成红色。

site.css

.logo {
    margin: auto;
    width: 60%;
    padding: 10px;
 }

.nav.navbar-nav.navbar-right a {
    color: red;
}

#h {
    color:red;
}

h1 {
    color: red;
}

body {
    min-height: 100vh;
    padding-top: 50px;
    padding-bottom: 20px;
    background-color: lightblue;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

portfolio-item {
   padding-bottom: 20px;
}

footer{
    height: 400px;
    background-color:blueviolet;
}

BundleConfig.cs

using System.Web;
using System.Web.Optimization;

namespace diversity
{
    public class BundleConfig
    {
        // For more information on bundling, visit https://go.microsoft.com/fwlink/?LinkId=301862
        public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                        "~/Scripts/jquery.validate*"));

            // Use the development version of Modernizr to develop with and learn from. Then, when you're
            // ready for production, use the build tool at https://modernizr.com to pick only the tests you need.
            bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                        "~/Scripts/modernizr-*"));

            bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                      "~/Scripts/bootstrap.js",
                      "~/Scripts/respond.js",
                      "~/Scripts/jsScripts.js"));

            bundles.Add(new StyleBundle("~/Content/css").Include(
                      "~/Content/bootstrap.css",
                      "~/Content/font-awesome.css",
                      "~/Content/site.css"));

        }
    }
}

_Layout.cshtml

    <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - My ASP.NET Application</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
</head>
<body>
    <div class="container">
        <img src="~/Images/logo.PNG" class="img-fluid" alt="Responsive image">
        <nav class="navbar container navbar-expand-md py-md-10">
            <a class="navbar-brand" id="x" href="#">theDiversity</a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>

            <div class="collapse navbar-collapse" id="navbarSupportedContent">
                <ul class="navbar-nav mr-auto">
                    <li class="nav-item">
                        <a class="nav-link" href="#">Home</a>
                    </li>
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            Ecosystems
                        </a>
                        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                            <a class="dropdown-item" href="#">Action</a>
                            <a class="dropdown-item" href="#">Another action</a>
                            <a class="dropdown-item" href="#">Something else here</a>
                        </div>
                    </li>
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            Species
                        </a>
                        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                            <a class="dropdown-item" href="#">Action</a>
                            <a class="dropdown-item" href="#">Another action</a>
                            <a class="dropdown-item" href="#">Something else here</a>
                        </div>
                    </li>
                </ul>
                <ul class="nav navbar-nav ml-auto">
                    <li>
                        <a href="#" class="nav-link"><i class="fa fa-camera-retro fa-lg"></i></a>
                    <li>
                        <a href="#" class="nav-link"><i class="fa fa-twitter fa-lg"></i></a>
                    <li>
                        <a href="#" class="nav-link"><i class="fa fa-pinterest fa-lg"></i></a>
                    </li>
                </ul>
            </div>
        </nav>
    </div>



    <div class="container">


        <div>
            <main class="col-xs-11 p-l-2 p-t-2">
                <br/>
                @RenderBody()

            </main>
        </div>


    </div>


    <footer class="app-footer">
        <div>
            <a href="https://coreui.io">CoreUI</a>
            <span>&copy; 2018 creativeLabs.</span>
        </div>
        <div class="ml-auto">
            <span>Powered by</span>
            <a href="https://coreui.io">CoreUI</a>
        </div>
        <div>
            <a href="https://coreui.io">CoreUI</a>
            <span>&copy; 2018 creativeLabs.</span>
        </div>
        <div class="ml-auto">
            <span>Powered by</span>
            <a href="https://coreui.io">CoreUI</a>
        </div>
        <div>
            <a href="https://coreui.io">CoreUI</a>
            <span>&copy; 2018 creativeLabs.</span>
        </div>
        <div class="ml-auto">
            <span>Powered by</span>
            <a href="https://coreui.io">CoreUI</a>
        </div>   
    </footer>

    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")
    @RenderSection("scripts", required: false)
</body>
</html>

Index.cshtml

    @model IEnumerable<diversity.Models.RSSFeed>
@{
    ViewBag.Title = "Home Page";
}

<div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
    <div class="carousel-inner">
        <div class="carousel-item active">
            <img class="d-block w-100" src="~/Images/bg1.jpg" alt="First slide">
        </div>
        <div class="carousel-item">
            <img class="d-block w-100" src="~/Images/bg1.jpg" alt="Second slide">
        </div>
        <div class="carousel-item">
            <img class="d-block w-100" src="~/Images/bg1.jpg" alt="Third slide">
        </div>
    </div>
    <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
        <span class="sr-only">Previous</span>
    </a>
    <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
        <span class="carousel-control-next-icon" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
    </a>
</div>
<br/>

<div class="row">

    <!-- Blog Entries Column -->
    <div class="col-md-9">
        <h1 id="h">Heading01</h1>

        @{
            Html.RenderAction("RSSFeed");
        }

        <hr>

        <!-- Pagination -->
        <ul class="pagination justify-content-center">
            <li class="page-item">
                <a class="page-link" href="#" aria-label="Previous">
                    <span aria-hidden="true">&laquo;</span>
                    <span class="sr-only">Previous</span>
                </a>
            </li>
            <li class="page-item">
                <a class="page-link" href="#">1</a>
            </li>
            <li class="page-item">
                <a class="page-link" href="#">2</a>
            </li>
            <li class="page-item">
                <a class="page-link" href="#">3</a>
            </li>
            <li class="page-item">
                <a class="page-link" href="#" aria-label="Next">
                    <span aria-hidden="true">&raquo;</span>
                    <span class="sr-only">Next</span>
                </a>
            </li>
        </ul>
    </div>
    <br />

    <!-- Sidebar Widgets Column -->
    <div class="col-md-3">

        <!-- Search Widget -->
        <div class="card my-6">
            <h5 class="card-header">Search</h5>
            <div class="card-body">
                <div class="input-group">
                    <input type="text" class="form-control" placeholder="Search for...">
                    <span class="input-group-btn">
                        <button class="btn btn-secondary" type="button">Go!</button>
                    </span>
                </div>
            </div>
        </div>

        <!-- Categories Widget -->
        <div class="card my-4">
            <h5 class="card-header">Categories</h5>
            <div class="card-body">
                <div class="row">
                    <div class="col-lg-6">
                        <ul class="list-unstyled mb-0">
                            <li>
                                <a href="#">Web Design</a>
                            </li>
                            <li>
                                <a href="#">HTML</a>
                            </li>
                            <li>
                                <a href="#">Freebies</a>
                            </li>
                        </ul>
                    </div>
                    <div class="col-lg-6">
                        <ul class="list-unstyled mb-0">
                            <li>
                                <a href="#">JavaScript</a>
                            </li>
                            <li>
                                <a href="#">CSS</a>
                            </li>
                            <li>
                                <a href="#">Tutorials</a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>


        <div class="card border-success my-4">
            <div class="card-header">Header</div>
            <div class="card-body text-success">
                 <a class="card-title">hhhhhhhhhhhhhhhhh</a><br/><br/>
            </div>
        </div>

    </div>

</div>
<!-- /.row -->

最佳答案

刚试过。对我有用，请在 Google Chrome 中尝试 CTRL+F5。

PS:由于声誉低，无法将其添加为对您的问题的评论

关于css - css 文件中的更改未反射(reflect)在 ASP.NET MVC 中的 View 中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/52699981/

上一篇：javascript - 如何在 vanilla javascript 中通过 DOM 创建多个元素？

下一篇：css - 禁用 polymer 中的所有 css 动画

相关文章：

html - 使用 CSS 添加虚线间隔器/填充

html - CSS动画，具有两个径向渐变在剪切蒙版内移动/旋转png

c# - 为 id 和 View 模型字段的名称添加前缀

jquery - 将 JSON 对象传递给操作并映射到 List<object>？

c# - 组合来自多个表的数据以在 MVC View 中显示

css - 尝试使用图像而不是文本创建下拉导航菜单，需要帮助链接

html - CSS Angular 的 ui-view 布局问题

asp.net-mvc - 编辑默认 TypeScript 模板/脚手架

javascript - 表格或 Div 高度和宽度调整为背景图像大小

asp.net-mvc - AntiForgeryToken 登录后无效

©2024 IT工具网  联系我们