如何美化单选框按钮？

最新推荐文章于 2024-08-27 12:41:05 发布

simoonQian

最新推荐文章于 2024-08-27 12:41:05 发布

阅读量610

点赞数

分类专栏： web前端

本文链接：https://blog.csdn.net/weixin_40814356/article/details/80959017

版权

web前端专栏收录该内容

51 篇文章 2 订阅

订阅专栏

.toggle
    text-align center
    width 40px
    height 40px
    position absolute
    top 0
    bottom 0
    margin auto 0
    //让按钮上下居中对齐
    border null
    //去除原始边框
    appearance none
    //去除按钮的原始样式
    outline none
    //去除外边框的线
    &:after
      content url('../assets/images/round.svg')
    //  未选中的图片
    &:checked:after
      content url('../assets/images/done.svg')
   // 选中后的图片