我無法讓我的CSS在我的頁面上運行。 這裏是我的html:CSS樣式只適用於不帶選擇器的元素
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>shubbler.xyz</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://fonts.googleapis.com/css?family=VT323" rel="stylesheet">
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
<div class="container-fluid">
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" style="font-family: 'VT323', monospace; font-size: 20px" href="/">Shubbler.xyz</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="/repost/">Repost</a></li>
<li><a href="/search/postsearch">Post Search</a></li>
<li><a href="/search/itemsearch">Item Search</a></li>
</ul>
<ul class="nav navbar-nav navbar-right ">
<li style="font-family: 'VT323', monospace; font-size: 30px"><a href="/donate">Donations</a></li>
</ul>
</div><!--/.nav-collapse -->
</div><!--/.container-fluid -->
</nav>
<div class="container">
<a href="/repost/">
<div class="row">
<div class="col-md-12 col-xs-12">
<div class="main-div" style="background-color:lightsalmon;">
<h2><span class="">Repost</span> for /r/GlobalOffensiveTrade</h2>
<br>
<p>Basically, this will repost your latest Reddit Trade.</p>
<p>Sign in with Reddit and confirm the Trade/Store that you want to repost.</p>
</div>
</div>
</div>
</a>
<a href="/search/postsearch">
<div class="row main-div">
<div class="col-md-12 col-xs-12">
<div style="background-color:lightblue;">
<h2>Post Search for /r/GlobalOffensiveTrade</h2>
<br>
<p>This feature will allow you to find posts by filtering either have or want.</p>
<p>Just search for a post below, check out the items in the post too.</p>
</div>
</div>
</div>
</a>
<a href="/search/itemsearch">
<div class="row main-div">
<div class="col-md-12 col-xs-12">
<div style="background-color:lightgreen;">
<h2>Item Search for /r/GlobalOffensiveTrade</h2>
<br>
<p>This feature will allow you to find items posted on /r/GlobalOffensiveTrade.</p>
<p>Just search for an item below, feel free to change float criteria too.</p>
</div>
</div>
</div>
</a>
</div>
</div>
</body>
</html>
這裏是我的CSS:
.main-row {
border-radius: 25px 25px 25px 25px;
-moz-border-radius: 25px 25px 25px 25px;
-webkit-border-radius: 25px 25px 25px 25px;
border: 4px solid #ff03ff;
background-color:lightsalmon;
}
#div {
border-radius: 25px 25px 25px 25px;
-moz-border-radius: 25px 25px 25px 25px;
-webkit-border-radius: 25px 25px 25px 25px;
border: 4px solid #ff03ff;
background-color:lightsalmon;
}
問題是,當我使用標籤作爲選擇,例如,如果我將所有的div或身體,它才能正常運行,像這樣:
div {
background-color: red;
}
但是,如果我使用類或id的選擇器,它不起作用。我已經與w3schools驗證器進行了檢查,並且不會返回通知或錯誤。
也許他們中的一些在引導中使用,所以你需要使用的重要 –
什麼/在哪裏#div!?和.main-row?我只看到.row和.main-div –