實現上述效果的程式碼，如下

...
<div class=radio>
    <input type="radio" name="deo" id="deo1">
    <label for="deo1"></label>
    <input type="radio" name="deo" id="deo2">
    <label for="deo2"></label>
</div>
...

    .radio input {
        display: none;/*取消預設樣式*/
    }
 
   
    .radio input+label {    /*緊接input出現的label，要有相同父元素*/
        display: inline-block;
        position: relative;
        border-radius: 50%;
        border: 1px #aaa solid;
        width: 14px;   /*外圈圓高度、寬度*/
        height: 14px; 
    }
    .radio input+label::after {  /*偽元素製作內部的圓*/
        content: " "
 
;
        border-radius: 50%;
        position: absolute;/*居中方法*/
        top: 50%;
        left: 50%;
        width: 6px; /*中心圓的寬度、高度*/
        height: 6px;
        margin-top: -3px;
        margin-left: -3px;
    }

    .radio input:checked+label {
        background-color: blue;/*選中後外圈圓顏色*/
        border-color
 
: blue;   
    }  
    .radio input:checked+label::after {   
        background-color: white;/*選中radio中心圓的顏色*/
    }

    <select>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="2">3</option>
    <select>

    select::-ms-expand { display: none; }/*IE,將預設的select選擇框樣式清除*/
    select {
        /*將預設的select選擇框樣式清除*/
            appearance: none;
            -moz-appearance: none;
            -webkit-appearance: none;
            background: url("自定義圖片.xxx") no-repeat scroll right  center transparent;
            background-size: 18px 26px;
    }