zoukankan      html  css  js  c++  java
  • 小程序单选按钮

    <radio color="red" checked='true' class='radio' value='s'></radio>
    <radio color="#000" checked='true' class='radio sm' value='s'></radio>
    <radio color="#66666" checked='true' class='radio radio-full' value='s'></radio>
    <radio color="green" checked='true' class='radio radio-full sm' value='s'></radio>
    <radio color="rgba(0,0,0,0.5)" checked='true' class='radio react' value='s'></radio>
    <radio color="blue" checked='true'class='radio react sm' value='s'></radio>
    <radio color="#FF00FF" checked='true' class='radio react radio-full' value='s'></radio>
    <radio color="#e4393c" checked='true' class='radio react radio-full sm' value='s'></radio>
    .radio {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      font-family: Helvetica Neue, Helvetica, sans-serif;
    }
    
    .radio {
      position: relative;
    }
    
    .radio .wx-radio-input {
      margin: 0;
      width: 24px;
      height: 24px;
    }
    
    .radio.react  .wx-radio-input {
      border-radius: 10% !important;
    }
    
    .radio::before, .radio .wx-radio-input::before {
      display: none;
    }
    
    .radio[checked]::after {
      content: "";
      background: transparent;
      display: block;
      position: absolute;
      width: 8px;
      height: 8px;
      z-index: 10;
      top: 0px;
      left: 0px;
      right: 0px;
      bottom: 0px;
      margin: auto;
      border-radius: 50%;
      border: 8px solid #fff !important;
    }
    
    .radio.react[checked]::after {
      border-radius: 10%;
    }
    
    .radio.sm .wx-radio-input {
      margin: 0;
      width: 14px;
      height: 14px;
    }
    
    .radio.sm[checked]::after {
      top: 1px !important;
      right: 1px !important;
      width: 4px;
      height: 4px;
      border: 5px solid #fff !important;
    }
    
    .radio[class*="-full"][checked]::after {
      width: 16px;
      height: 16px;
      border: 4px solid #fff !important;
    }
    
    .radio.sm[class*="-full"][checked]::after {
      top: 1px;
      right: 1px;
      width: 8px;
      height: 8px;
      border: 3px solid #fff !important;
    }
    
    .radio.react[class*="-full"][checked]::after {
      width: 16px;
      height: 16px;
      border: 4px solid #fff !important;
    }
    
    .radio.react.sm[class*="-full"][checked]::after {
      top: 1px;
      right: 1px;
      width: 8px;
      height: 8px;
      border: 3px solid #fff !important;
    }
  • 相关阅读:
    病历管理系统(附源码)
    2013年未之wpf项目乱述
    非农行情的做单策略
    Open Source Trading Platforms ( who needs mt4 ?)
    【原创】如何获得近10年的1分钟完整历史数据并导入MT4
    MetaTrader 4客户端的秘密
    六张图教你交易美国5月非农数据
    创业手札
    如果想开公司,你必须了解这些!!创业的人收藏吧!!
    如何开设港股和美股投资账户
  • 原文地址:https://www.cnblogs.com/dianzan/p/10949270.html
Copyright © 2011-2022 走看看