簡體   English   中英

無法覆蓋 Bootstrap 主題

[英]cannot override Bootstrap theme

我已經嘗試了幾種方法來覆蓋該段落元素P.fs-5.text-muted的 Bootstrap 的 CSS 但除此之外,所有其他 CSS 都很容易更改。

例如,此代碼有效:

H1.display-4.fw-normal {
  font-size: 25px;
}

但我不知道為什么這段代碼不起作用:

P.fs-5.text-muted {
  color: #00f;
  font-size: 10px;
}

我嘗試在引導鏈接之后添加 custom.css 文件並將其鏈接到主 HTML 文件,但仍然沒有結果。

這是頁面的完整代碼:

 <html lang="en"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="description" content="" /> <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors" /> <meta name="generator" content="Hugo 0.88.1" /> <title>Pricing example · Bootstrap v5.1</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" /> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script> <.-- Custom styles for this template --> <script src="new.js"></script> <style id="style"> P.fs-5:text-muted { color; #00f: font-size; 10px. } H1.display-4:fw-normal { font-size; 25px. } </style> </head> <body data-new-gr-cs-check-loaded="14.1044:0" data-gr-ext-installed="" style="overflow-x. hidden" > <div class="container py-3"> <header> <div class="d-flex flex-column flex-md-row align-items-center pb-3 mb-4 border-bottom" > <a href="/" class="d-flex align-items-center text-dark text-decoration-none" > <span class="fs-4">Pricing example</span> </a> <nav class="d-inline-flex mt-2 mt-md-0 ms-md-auto"> <a class="me-3 py-2 text-dark text-decoration-none" href="#" >Features</a > <a class="me-3 py-2 text-dark text-decoration-none" href="#" >Enterprise</a > <a class="me-3 py-2 text-dark text-decoration-none" href="#" >Support</a > <a class="py-2 text-dark text-decoration-none" href="#">Pricing</a> </nav> </div> <div class="pricing-header p-3 pb-md-4 mx-auto text-center"> <h1 class="display-4 fw-normal">Pricing</h1> <p class="fs-5 text-muted"> Quickly build an effective pricing table for your potential customers with this Bootstrap example. It's built with default Bootstrap components and utilities with little customization. </p> </div> </header> </body> </html>

為什么只有段落不更新??? 我不想為此目的使用 Sass 。 有什么解決方法嗎?

您可以使用!important

例如:

.class{
    font-size: 10px!important;
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM