Bootstrap 4：自定義複選框邊框

Question

我試圖自定義我的複選框的顏色。我跟着的文檔，我想出了一個辦法來改變背景：

.custom-control-input:checked ~ .custom-control-indicator { 
     background-color: #ffa500; 
} 

如果單擊該複選框也有藍色邊框與（我認爲）環繞箱本身的填充，但即使有一些研究，我無法找到如何改變邊界的顏色。任何人都可以幫助我？我做了一個fiddle來證明我有什麼。

任何人都知道如何改變邊界？

在此先感謝！

Answer 1

引導4使用box-shadow得到這樣的效果：

.custom-control-input:focus~.custom-control-indicator { 
    -webkit-box-shadow: 0 0 0 1px #fff, 0 0 0 3px #0275d8; 
    box-shadow: 0 0 0 1px #fff, 0 0 0 3px #0275d8; 
} 

圓角邊框與border-radius定義：

.custom-checkbox .custom-control-indicator { 
    border-radius: .25rem; 
}