在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML/ 運(yùn)用偽類實(shí)現(xiàn)復(fù)選框的樣式問(wèn)題

運(yùn)用偽類實(shí)現(xiàn)復(fù)選框的樣式問(wèn)題

樣式代碼:

input[type="checkbox"] {
    border: 1px solid #a9afb4;
    text-align: center;
    padding: 0;
    margin: 0;
    width: 16px;
    height: 16px;
    background: white;
    -webkit-appearance: none;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    vertical-align: middle;
    color: #fff;
    transition: all 0.1s linear;
    cursor: pointer;
  }

  input[type="checkbox"]:before {
    content: "?";
    font-size: 8px;
  }


  input[type="checkbox"]:checked {
    background: #0AA89E;
    border: none;
    color: #fff;
  }

clipboard.png

如果里面的勾號(hào)不用特殊字符打上去的話,可以用什么樣式實(shí)現(xiàn),請(qǐng)大神們幫幫忙看看??

回答
編輯回答
焚音

content: '\2714';你可以參考HTML CSS 特殊字符表,我寫(xiě)的幾個(gè)復(fù)選框鏈接描述,當(dāng)然你要正規(guī)點(diǎn)的還是推薦用字體圖標(biāo)庫(kù)來(lái)搞

2017年9月25日 09:20
編輯回答
失魂人

樓上說(shuō)的特殊字符表好像更方便一點(diǎn),我這里再說(shuō)一個(gè)方法吧:

大致思路:如果想要一個(gè)勾號(hào),先設(shè)置div的widthheight,再設(shè)置邊框粗細(xì),類型和顏色,最后將上邊框和左邊框去掉,這時(shí),邊框就只剩下右邊框和下邊框,只要將此div旋轉(zhuǎn)45度,就可以了

代碼大致如下:

.xxx-radio:checked+.xxx-radio-label:after {
    width: 5px;
    height: 10px;
    border: 2px solid rgba(25,164,137,1);
    border-top: none;
    border-left: none;
    transform: rotate(45deg)
}
2017年8月19日 13:29