Html 未应用新创建的CSS类
我的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>
<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;
}
你的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;
}