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);
      }

  • 相关阅读:
    Android--->activity高级运用,保存前一个界面为完成的数据savedInstanceState。
    Android--->activity界面跳转,以及查看生命周期过程
    Android--->Intent
    Android--->Button按钮操作
    安卓EditText按钮
    DDS视图&Button控件
    Android之EditText控件
    Android之TextView控件的学习
    usb免驱动摄像头实验
    Flash硬件原理
  • 原文地址:https://www.cnblogs.com/lvlisn/p/14735415.html
Copyright © 2011-2022 走看看