zoukankan      html  css  js  c++  java
  • 微信小程序checkbox样式和background修改

    /*checkbox 整体大小  */
    checkbox {
        width: 34rpx;
        height: 34rpx;
        margin-top:7.5rpx;
        margin-right:24rpx;
      }
      /*checkbox 选项框大小  */
      checkbox .wx-checkbox-input {
        width: 34rpx;
        height: 34rpx;
      }
      /*checkbox选中后样式  */
      checkbox .wx-checkbox-input.wx-checkbox-input-checked {
        background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAACZUlEQVRYR82YQUwTQRSG/1doIwqYoCEiMQE0Ib1wcBsTD57wAB5AYzQmnrzoATgYxXAyHMF6ay/c8WIkgJJo4s2r1aTRRDm0eNC2RE3Uqqys7SOzZWtpd3dwu0t3jrNv5n375p83b4Zg0pQ5DmJz7TwIowBHABwFo83MVtpHyAPIAJQAYxmh3qVXN0irHkfVHSfjHy4QF6IAjkudODNIMTVNvh7vWawc/g9kmgORw2szDNwGcw2gM58Wo4iEg/uJL71TmKaisCo7jMTT95h50lWHksmIKJoY77tTBtGXA8UFzyNRIwxiRuCiWCYqCTP9zkNNyIKcQqgvTEosfQnghzJrb7/TZVLi6XkwX/XWkVQsD0iJp96D0d9YEKwKkB+Ok5Vb9IQ8KbEUuzWf2Tyj4VaMne7Az80i7j7/jLfrf0zdeQpyZaAdt84cAlEpXb3Jqbj2KLO3INUQDQExg1C1IsaWs0jm9mhprCBuruTw8pNqKUdbjQQDwHB/6fR/upqHph9P1s0phH7W2O2amaFOnD3RqntOZlRMPMnit2a+yeqBkIK8uN6D/aFAOQTJrIqJx7Uw9UJIQWaHOjG4HRGDphrGDQgpyIEgITbShYGufTuEYcCMhNt25AlhJHaHTJhmKpMmNCuYj981dLc3l5NVPRDSiBjkVjCVf+Y0EsYc0ojsBqZeiF1HxA7GDYgSyH+WAWKZoueO4NSxFnzbKGDq2ToSNhnTPgVuf9XLAAeFkThLuw824+uvAjb+ulBFkF4Y+aVU9E3x7JfrhJCLLy5Yhqp9ceXUYfxyCTci0/hniYrM04iHmi06cW9W0VTaoAAAAABJRU5ErkJggg==");
        background-size: 100% 100%;
        background-repeat: no-repeat;
      }
      /*checkbox选中后图标样式  */
      checkbox .wx-checkbox-input.wx-checkbox-input-checked::before {
        width: 28rpx;
        height: 28rpx;
        line-height: 28rpx;
        text-align: center;
        font-size: 22rpx;
        color: #fff;
        background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAACZUlEQVRYR82YQUwTQRSG/1doIwqYoCEiMQE0Ib1wcBsTD57wAB5AYzQmnrzoATgYxXAyHMF6ay/c8WIkgJJo4s2r1aTRRDm0eNC2RE3Uqqys7SOzZWtpd3dwu0t3jrNv5n375p83b4Zg0pQ5DmJz7TwIowBHABwFo83MVtpHyAPIAJQAYxmh3qVXN0irHkfVHSfjHy4QF6IAjkudODNIMTVNvh7vWawc/g9kmgORw2szDNwGcw2gM58Wo4iEg/uJL71TmKaisCo7jMTT95h50lWHksmIKJoY77tTBtGXA8UFzyNRIwxiRuCiWCYqCTP9zkNNyIKcQqgvTEosfQnghzJrb7/TZVLi6XkwX/XWkVQsD0iJp96D0d9YEKwKkB+Ok5Vb9IQ8KbEUuzWf2Tyj4VaMne7Az80i7j7/jLfrf0zdeQpyZaAdt84cAlEpXb3Jqbj2KLO3INUQDQExg1C1IsaWs0jm9mhprCBuruTw8pNqKUdbjQQDwHB/6fR/upqHph9P1s0phH7W2O2amaFOnD3RqntOZlRMPMnit2a+yeqBkIK8uN6D/aFAOQTJrIqJx7Uw9UJIQWaHOjG4HRGDphrGDQgpyIEgITbShYGufTuEYcCMhNt25AlhJHaHTJhmKpMmNCuYj981dLc3l5NVPRDSiBjkVjCVf+Y0EsYc0ojsBqZeiF1HxA7GDYgSyH+WAWKZoueO4NSxFnzbKGDq2ToSNhnTPgVuf9XLAAeFkThLuw824+uvAjb+ulBFkF4Y+aVU9E3x7JfrhJCLLy5Yhqp9ceXUYfxyCTci0/hniYrM04iHmi06cW9W0VTaoAAAAABJRU5ErkJggg==");
        transform: translate(-50%, -50%) scale(1);
        -webkit-transform: translate(-50%, -50%) scale(1);
      }

  • 相关阅读:
    2018-11-28笔记
    2018-11-27笔记
    2018-11-26笔记
    DBUtils和连接池
    动态页面技术(JSP/EL/JSTL)
    会话技术Cookie&Session
    JavaEE—— HttpServletRequest
    JavaEE—— HttpServletResponse
    JavaWeb核心之Servlet
    JavaEE——HTTP协议和Tomcat服务器
  • 原文地址:https://www.cnblogs.com/lvlisn/p/14735415.html
Copyright © 2011-2022 走看看