16. Liquid checkbox effect

Effect (the source code network disk address is at the end)

Pay attention to the public account "Moving the World" to see more video tutorials!

source code

index.html

<!DOCTYPE html>
<html lang="en" >
<head>
  <meta charset="UTF-8">
  <link rel="stylesheet" href="./style.css">

</head>
<body>

<div id="container">
  <input type="checkbox" id="circle-input"/>
  <label for="circle-input" id="circle-cont">
    <div id="circle"></div>
  </label>
  <label for="circle-input" id="label-name">
    Radio button
  </label>
</div>
  
</body>
</html>

css

&

Guess you like

Origin blog.csdn.net/qq449245884/article/details/122748571