為什麼我的 hr 標籤設定為白色純色時是半透明的?
P粉957661544
P粉957661544 2024-04-06 16:13:26
0
1
615

我有一個html(帶有引導程式)和一個CSS,在我的html中我有一個<hr>標籤,它有一個類,然後在我的CSS中我有它的邊框樣式。它是半透明的,你可以看到白色,但它不是“固體”。我希望它是完全固體的,而不是像我猜的那樣蒼白。

body { background-color: #1b3b3c !important; color: white !important; }

.hr-left-bold {
  border: 0.2rem solid #fff;
  border-radius: 100rem;
  width: 20rem;
}
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
<h3>Kérdés Cím</h3>
<hr class="hr-left-bold">
<p>Nem kéne így hagyni...</p>
<hr class="hr-left-bold">
<img src="./src/upvote.png" alt="like" class="img-fluid vote-img px-1">
<img src="./src/downvote.png" alt="like" class="img-fluid vote-img px-1">

它看起來像這樣:

老實說,我嘗試使用邊框頂部、顏色等所有內容來設計它,但沒有任何效果。

這是我想要的樣子:

#
P粉957661544
P粉957661544

全部回覆(1)
P粉020556231

在較新的引導版本中,有特殊的「垂直規則」類別/規則,具有一定的透明度。

為避免這種情況,請將 opacity: 1.0; 新增到您的 CSS 規則中。

body {
  background-color: #1b3b3c !important;
  color: white !important;
}

.hr-left-bold {
  border: 0.2rem solid #fff;
  border-radius: 100rem;
  width: 20rem;
  opacity: 1.0;
}

Kérdés Cím


Nem kéne így hagyni...


like like
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板