我正在學習 Bootstrap，但我不明白為什么使用正文選擇器不會覆寫默認的 Bootstrap 樣式。同時，我自己的樣式在使用通用選擇器 (*) 時適用。這是 HTML（您會看到我在樣式表之前鏈接 Bootstrap）：
body {
font-family: 'Oxygen', sans-serif;
font-size: 24px;
font-weight: normal;
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>David Chu's China Bistro</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Oxygen:wght@300;400;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<h1>Hello, World!</h1>
<script src="js/bootstrap.min.js"></script>
</body>
</html>我想設定自己的字體樣式，但它不起作用。但是，它會隨著通用選擇器 (*) 的變化而變化。有什么問題？
uj5u.com熱心網友回復：
這里發生的情況是，您的 CSS 規則body被其他更具體元素的引導屬性覆寫，例如h1. 您的規則僅適用于正文元素中的純文本。
CSS 的行為遵循特殊性規則。當特異性相等時，CSS 優先級來自：
- 具有
style屬性的 HTML 元素 <style>HTML 檔案中的標記- 外部 CSS 檔案，最后加載優先
值得注意的是，任何帶有宣告的 CSS 屬性都會提升優先級堆疊中的專案，但如果鏈中其他地方的競爭 CSS 屬性也有宣告!important，則可以覆寫它。!important
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/421764.html
標籤：
下一篇：使YouTube視頻嵌入回應式