Html 未应用新创建的CSS类

Html 未应用新创建的CSS类,html,css,asp.net,razor,visual-studio-2017,Html,Css,Asp.net,Razor,Visual Studio 2017,我的CSS新类有一个奇怪的问题 没有将样式应用于元素 我尝试应用样式的元素是 <p class="Review_Title">Delicious Pizza</p> <p class="Review_Tag">@@Restaurant Name </p> <p class="Review_Desc">Restaurant Desc.</p> <div class="Review_Bar"></div>

我的CSS新类有一个奇怪的问题 没有将样式应用于元素 我尝试应用样式的元素是

<p class="Review_Title">Delicious Pizza</p>
<p class="Review_Tag">@@Restaurant Name </p>
<p class="Review_Desc">Restaurant Desc.</p>
<div class="Review_Bar"></div>
这是整个样式表

.parallax_scrolling {
background-attachment: fixed;
background-color: #645862;
background-image: url("../images/restaurant_2.jpg");
background-position: center top;
background-repeat: no-repeat;
background-size: cover;
color: #FFF;
cursor: default;
text-align: center;
padding:0px;
}
.parallax_scrolling_Row {
background-attachment: fixed;
background-color: #645862;
background-image: url("../images/restaurant_3.jpg");
background-position: center top;
background-repeat: no-repeat;
background-size: cover;
color: #FFF;
cursor: default;
text-align: center;
}
.row li{
list-style-type:none;
}
.row a {
    color: #f8bd08;
}
.dark_background {
background-color: rgba(31, 20, 20, 0.6);
padding: 40px 0px;
}
.oxygen {
font-family: 'Oxygen', sans-serif;
font-size: 28px;
color: white;
letter-spacing: 5px;
text-align: center;
text-transform: uppercase;
padding: 5px 10px 5px 10px;
margin: 60px 0px 60px 0px;
border: 2px solid #FFF;
}
.oxygen_info_banner {
font-family: 'Oxygen', sans-serif;
font-size: 26px;
color: black;
letter-spacing: 5px;
text-transform: uppercase;
}
.niconne_info_banner {
font-family: 'Niconne', cursive;
color: #f8bd08;
font-size: 55px;
}
.lato {
font-family: 'Lato', sans-serif;
text-align: center;
font-size: 28px;
}
.niconne {
font-family: 'Niconne', cursive;
color: #f8bd08;
font-size: 65px;
text-align: center;
font-weight: 400;
}
.niconne_Row {
font-family: 'Niconne', cursive;
color: #f8bd08;
font-size: 50px;
text-align: center;
font-weight: 400;
}
.title_banner {
border-top: 2px solid #f8bd08;
border-bottom: 2px solid #f8bd08;
padding-top:10px;
padding-bottom:10px;
margin-top:30px;
margin-bottom:30px;
font-family: 'Niconne', cursive;
color: #f8bd08;
font-size: 60px;
text-align: center;
font-weight: 400;
}
.title_banner h1 {
font-size:50px;
}
.collapse_Box {
border:none;
}
.review_box {
background-color:Highlight;
height:500px;
}
#Italian_Button_Dropdown{
border:1px solid gray;
background-color:lightgray;
border-radius:4px;
padding:6px;
}
#Italian_dropdown {
border:2px solid gray;
border-width:0px 1px 1px 1px;

}
#Asian_dropdown {
border: 2px solid gray;
border-width: 0px 1px 1px 1px;
}
.Review_Title{
font-size:80px;

}
.Review_Tag{
font-weight:bold;
}
.Review_Desc{
color:gray;
} 
.Review_Bar {
border-bottom: 2px solid #f8bd08;
height:10px;
}
  • 您可以在浏览器中使用Inspect模式检查您创建的HTML元素和相关样式
  • 我看到你在复习栏课上没有创建任何按钮
  • 如果在第一步中找不到任何与元素相关的CSS,最好检查CSS文件的路径

  • 你的CSS没有什么问题(尽管除非你真的需要使用它,否则你通常应该避免大写),所以一定是样式表没有被应用。你的浏览器控制台中有错误吗?控制台中没有错误:(我在同一页上的同一页上的样式工作正常我注意到我有一个标题正确地从工作表中获取了它的样式,但是当我看到“Review_title”元素时,它看不到类,所以如果单击“mystyle.css”在Chrome工具中,它将显示您的CSS文件-该文件是否具有缺少的CSS属性?:O您是对的,在使用CSS时,类没有列在mystyle.CSS中的sources有用建议下:Chrome开发工具中有一个选项,在开发工具打开时从不使用缓存-我发现这非常有用,所以我不需要继续清除缓存!
    <environment names="Development">
        <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
        <link rel="stylesheet" href="~/css/site.css" />
        <link rel="stylesheet" href="~/css/mystyle.css" />
        <link href="~/css/elastic_grid.min.css" rel="stylesheet" type="text/css" />
        <link href="https://fonts.googleapis.com/css?family=Niconne" rel="stylesheet" type="text/css">
        <link href="https://fonts.googleapis.com/css?family=Lato|Oxygen" rel="stylesheet" type="=text/css">
    
    .Review_Title{
    font-size:80px;
    }
    .Review_Tag{
    font-weight:bold;
    }
    .Review_Desc{
    color:gray;
    }
    .Review_Bar {
    border-bottom: 2px solid #f8bd08;
    height:10px;
    }
    
    .parallax_scrolling {
    background-attachment: fixed;
    background-color: #645862;
    background-image: url("../images/restaurant_2.jpg");
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
    color: #FFF;
    cursor: default;
    text-align: center;
    padding:0px;
    }
    .parallax_scrolling_Row {
    background-attachment: fixed;
    background-color: #645862;
    background-image: url("../images/restaurant_3.jpg");
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
    color: #FFF;
    cursor: default;
    text-align: center;
    }
    .row li{
    list-style-type:none;
    }
    .row a {
        color: #f8bd08;
    }
    .dark_background {
    background-color: rgba(31, 20, 20, 0.6);
    padding: 40px 0px;
    }
    .oxygen {
    font-family: 'Oxygen', sans-serif;
    font-size: 28px;
    color: white;
    letter-spacing: 5px;
    text-align: center;
    text-transform: uppercase;
    padding: 5px 10px 5px 10px;
    margin: 60px 0px 60px 0px;
    border: 2px solid #FFF;
    }
    .oxygen_info_banner {
    font-family: 'Oxygen', sans-serif;
    font-size: 26px;
    color: black;
    letter-spacing: 5px;
    text-transform: uppercase;
    }
    .niconne_info_banner {
    font-family: 'Niconne', cursive;
    color: #f8bd08;
    font-size: 55px;
    }
    .lato {
    font-family: 'Lato', sans-serif;
    text-align: center;
    font-size: 28px;
    }
    .niconne {
    font-family: 'Niconne', cursive;
    color: #f8bd08;
    font-size: 65px;
    text-align: center;
    font-weight: 400;
    }
    .niconne_Row {
    font-family: 'Niconne', cursive;
    color: #f8bd08;
    font-size: 50px;
    text-align: center;
    font-weight: 400;
    }
    .title_banner {
    border-top: 2px solid #f8bd08;
    border-bottom: 2px solid #f8bd08;
    padding-top:10px;
    padding-bottom:10px;
    margin-top:30px;
    margin-bottom:30px;
    font-family: 'Niconne', cursive;
    color: #f8bd08;
    font-size: 60px;
    text-align: center;
    font-weight: 400;
    }
    .title_banner h1 {
    font-size:50px;
    }
    .collapse_Box {
    border:none;
    }
    .review_box {
    background-color:Highlight;
    height:500px;
    }
    #Italian_Button_Dropdown{
    border:1px solid gray;
    background-color:lightgray;
    border-radius:4px;
    padding:6px;
    }
    #Italian_dropdown {
    border:2px solid gray;
    border-width:0px 1px 1px 1px;
    
    }
    #Asian_dropdown {
    border: 2px solid gray;
    border-width: 0px 1px 1px 1px;
    }
    .Review_Title{
    font-size:80px;
    
    }
    .Review_Tag{
    font-weight:bold;
    }
    .Review_Desc{
    color:gray;
    } 
    .Review_Bar {
    border-bottom: 2px solid #f8bd08;
    height:10px;
    }