我嘗試制作一個頁面來通過各種 js 庫來控制我的放大器。
1.) 您能告訴我如何更改所選引導程式 5 按鈕的藍色邊框嗎？（使用淺綠色而不是藍色，我想避免使用 scss 以使其盡可能簡單）
展示： https : //schoko11.github.io/KEKO-WEB/#
Repo（抱歉弄亂了，不是最新版本但問題可見）： https : //github.com/schoko11/KEKO-WEB
2.) 在大螢屏上使用它時，您可以在底部看到白色背景，因為灰色背景不會向下延伸整個視口高度.... -> 我將 body 設定為
高度：100vh；
謝謝！
uj5u.com熱心網友回復：
1.) 從本頁的檔案中，您只能通過 CSS 或 Sass (Scss) 更改藍色邊框。藍色邊框實際上是box-shadow在:focus和/或:active偽類。
2.) 你必須為allcont課堂設定全高。
<!DOCTYPE html>
<html>
<body>
<div class="allCont">
<div class="wrapper-for-test">
<button class="btn btn-primary" type="button">
A Button
</button>
</div>
</div>
</body>
</html>
body {
height: 100vh;
}
.allCont {
background-color: rgba(0, 255, 0, .5); /* for test only */
height: 100%;
}
.btn-check:focus .btn-primary,
.btn-primary:focus {
box-shadow: 0 0 0 .25rem rgba(255,0,0,.5);
}
.btn-check:active .btn-primary:focus,
.btn-check:checked .btn-primary:focus,
.btn-primary.active:focus,
.btn-primary:active:focus,
.show > .btn-primary.dropdown-toggle:focus {
box-shadow: 0 0 0 .25rem rgba(255,0,0,.5);
}
/* for test only */
.wrapper-for-test {
padding: 50px;
}
看到它在行動
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/379691.html
標籤：css bootstrap-5