CSS3实现一个开关按钮控件

最新推荐文章于 2024-05-16 03:09:27 发布

justforuse

最新推荐文章于 2024-05-16 03:09:27 发布

阅读量6.3k

点赞数

分类专栏： html/css 文章标签： css3 html 控件开关按钮自定义

本文链接：https://blog.csdn.net/u014291497/article/details/52454194

版权

之前有写过自定义一个复选框的样式。
链接：http://blog.csdn.net/u014291497/article/details/52081774

又做了一个左右滑动开关效果的复选框。

效果图：

这里写图片描述

上图左侧为了显示数据变化所以显示出来，实际使用中设置display:none 属性就可以了。

本示例中全部使用HTML及CSS实现。

github地址：https://github.com/justforuse/HTML-CSS-JS/tree/master/customize-radio

代码：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title></title>
    <script></script>
    <style>
    .text {
        display: none;
    }
    .on{
        color:#333;
    }
    .off{
        color:#eee;
    }
    .circle {

最低0.47元/天解锁文章

justforuse

关注

0
点赞
踩
5

收藏

觉得还不错? 一键收藏
0
评论
CSS3实现一个开关按钮控件

之前有写过自定义一个复选框的样式。链接：http://blog.csdn.net/u014291497/article/details/52081774又做了一个左右滑动开关效果的复选框。效果图：上图左侧为了显示数据变化所以显示出来，实际使用中设置display:none 属性就可以了。本示例中全部使用HTML及CSS实现。github地址：https://github.com/justforu
复制链接

扫一扫