radio单选框样式

css:

/*labelinputcheck*/
            .labelinputcheck{padding: 10px;}
            .labelinputcheck .inputcheck{padding: 0px 16px;}
            .labelinputcheck .inputcheck input[type="radio"]{position: relative; left: -9999em; vertical-align: middle;}
            .labelinputcheck .inputcheck input[type="radio"]:checked + .icon-check{border-width: 5px; border-color: #1AAD19;}
            .labelinputcheck .inputcheck .icon-check{width: 16px; height: 16px; border-radius: 50px; border: 1px solid #C9CDD3; display: inline-block; vertical-align: middle;}
            .labelinputcheck .inputcheck span{vertical-align: middle;}

 

html:

<!--labelinputcheck start-->
        <div class="labelinputcheck" align="right">
            <label class="inputcheck">
                <input type="radio" name="name" value="1">
                <i class="icon-check"></i>
                <span>简体中文</span>
            </label>
            <label class="inputcheck">
                <input type="radio" name="name" value="2">
                <i class="icon-check"></i>
                <span>English</span>
            </label>
            <input type="range" min="1" max="100" value="1">
        </div>
        <!--labelinputcheck stop-->

 效果图：