チェックボックス修飾された微小チャンネルパターン

https://www.jianshu.com/p/f8d7932006c0

https://blog.csdn.net/qq_36894527/article/details/83893426

/ *チェックボックス全体のサイズ* / 
チェックボックス{ 
  幅:240rpx; 
  高さ:90rpx; 
} 
/ *ブロックサイズオプションチェックボックス* / 
チェックボックス.wx-INPUT-チェックボックス{ 
  幅:50rpx; 
  高さ:50rpx; 
} 
/ * *バック選択されたスタイルのチェックボックス/ 
チェックボックス.wx-チェックボックス- input.wx-チェックボックスにチェック-INPUT-{ 
  背景:#1 FF525C; 
} 
/ *チェックボックスのスタイルアイコンをチェック* / 
チェックボックス.wx-チェックボックスのチェックボックス-INPUT-input.wx・ビフォア・確認:: { 
  幅:28rpx; 
  高さ:28rpx; 
  行の高さ:28rpx; 
  テキスト整列=左:センター; 
  フォントサイズ:22rpx; 
  色:#FFF; 
  背景:透明; 
  変換:(-50%-50%)を変換(スケール1);
  -webkit-変換:(-50%-50%)変換スケール(1)。
}

 ラジオのスタイルを変更します。

無線INPUT-.wx無線{ 
   ボーダーRADIUS:50%; / *ヒレ* / 
   幅:40rpx; 
   高さ:40rpx; 
} 
/ *選択された背景パターン(赤い背景の境界線は、それらのUI要件のように変更しなくてもよいです)* / 
ラジオラジオ.wxチェック・ラジオINPUT-input.wx { 
   ボーダー:なし; 
   背景:赤; 
} 
/ *チェックマークパターン(白色のチェックマークは、そのUIの要件のように変更してもよい)を選択する* / 
ラジオ.wx無線---チェック:: {前input.wx -radio入力
   ボーダーRADIUS:50%; / *フィレット* / 
   幅:40rpx; / *背景* /サイズ超えない、サイズをチェックするチェック
   高さ: 40rpx; / *あなたがチェックマークのサイズを選択すると、背景* /のサイズ超えない
   行の高さ:40rpxを、
   テキスト、整列=左:センター; 
   フォントサイズ:30rpx; / * *ティック・サイズの30rpx / 
   -webkit-変換:(-50%-50%)スケール(1)翻訳します。 
   カラー:#FFF; / *カラー白のチェックマーク* / 
   背景:透明;
   変換:(-50%、-50%)翻訳スケール(1);
} 
--------------------- 
免責事項:この記事は、元の記事のCSDNブロガー「オバマ醤油」で、CC BY-SA 4.0の著作権契約に従って、再現します元のソースのリンクと、この文を添付してください。
オリジナルリンクします。https://blog.csdn.net/qq_36894527/article/details/83893426

 

おすすめ

転載: www.cnblogs.com/MR-cui/p/11323040.html