Бесплатный раздел

    Уважаемые друзья и пользователи сайта ART-UCOZ!

    Уведомляем вас о том, что мы приняли трудное, но обдуманное решение о закрытии проекта в качестве Интернет-магазина ART-UCOZ. С 05.11.2022 года сайт ART-UCOZ.RU продолжит работать в качестве каталога файлов, статей и информации. Будет закрыт только раздел интернет-магазина!

    Все товары были перенесены в наш новый проект SHOPTHEMES - Vendor Marketplace (https://shopthemes.ru), над которым мы долго работали и продолжаем улучшать его в настоящее время.
    Вас ждут: личный кабинет, возможность пополнения баланса на любую сумму, зачисление бонусов за посещение, перевод средств между пользователями, вывод средств (для продавцов), личный чат, больше новых цифровых товаров и многое другое.

    Уважаемые пользователи!
    Доводим до вашего сведения, что мы не занимаемся обучениями по системе uCoz и настройками Ваших сайтов.
    Подобные просьбы и вопросы - будут игнорироваться!

    Стилизация CheckBox в настройках пользователя

    Дата добавления: 28.09.2017 - 18:49
    Добавил: Buger
    Количество просмотров: 1.8k
    Количество комментариев: 0
    Рейтинг материала: 5.0 / 2
    Стилизация CheckBox в настройках пользователя
    БЕСПЛАТНО
    рейтинг 5.0
    /
    голосов 2
    Делюсь с вами красивым решением с просто анимированной стилизации Checkbox в настройках пользователя. (Работает только в настройках пользователя, на страницах добавления материала работать не будет)



    Установка :
    Заходим в пенель управления, Страница редактирования данных пользователя и вставляем перед
    Код
    </head>
    :
    Код
    <style>
    input[type="checkbox"] { display: none; }

    input[type="checkbox"] + label {
      display: block;
      position: relative;
      padding-left: 35px;
      margin-bottom: 20px;
      font: 14px/20px 'Open Sans', Arial, sans-serif;
      cursor: pointer;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
    }

    input[type="checkbox"] + label:last-child { margin-bottom: 0; }

    input[type="checkbox"] + label:before {
      content: '';
      display: block;
      width: 20px;
      height: 20px;
      border: 1px solid #6cc0e5;
      position: absolute;
      left: 0;
      top: 0;
      opacity: .6;
      -webkit-transition: all .12s, border-color .08s;
      transition: all .12s, border-color .08s;
    }

    input[type="checkbox"]:checked + label:before {
      width: 10px;
      top: -5px;
      left: 5px;
      border-radius: 0;
      opacity: 1;
      border-top-color: transparent;
      border-left-color: transparent;
      -webkit-transform: rotate(45deg);
      transform: rotate(45deg);
    }
    </style>


    На этом установка закончена.

    Источник: http://7uarts.ucoz.org/
    Добавлять комментарии могут только зарегистрированные пользователи.


    Поделись с друзьями: