<input type=”radio” />元素在Chrome上的效果,如下
Android上显示也正常,但是在IOS上,中间的勾是灰黑色的,如下:
实现代码如下:
input[type=radio] { content: ''; 0.4rem; height: 0.4rem; line-height: 0.4rem; vertical-align:middle; margin-top: 0; -webkit-appearance: none; } input[type="radio"]::before, input[type="radio"]:checked::before { content: ''; 0.4rem; height: 0.4rem; line-height: 0.4rem; text-align: center; display: block; color: #fff; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } input[type="radio"]::before { background: #fff; border: 1px solid #EFEFEF; } input[type="radio"]:checked::before { background-color: @mainColor; content: '2714fe0e'; color: #fff!important; border: 1px solid @mainColor; font-size: 0.186rem; }