Шкатулка CodeW3C.com
- Предыдущая страница Шкатулка CodeW3C.com
- Следующая страница Панель иконок
Шкатулка CodeW3C.com
Добро пожаловать в разнообразный мир переднего края. Вы можете здесь углубиться в изучение常用的 интерфейсных элементов и способов взаимодействия.
Мы подготовили для вас сотни примеров и тысячи фрагментов кода, чтобы помочь вам в практических тренировках.
Эти примеры очень优良:
- Разделенное обучение
- Четкие комментарии
- Интерактивные демонстрации на странице
- Онлайн TIY тест
- Эстетично, высокая доступность, высокая повторяемость
- Нативный HTML, CSS, JavaScript
Надеемся, что вы получите радостное и эффективное обучение!
Таблица содержания
- Панель иконок
- Иконка меню
- Аkkordeон
- Табы
- Вертикальные табы
- Заголовок таба
- Полная страница табов
- Табы при наведении
- Верхняя навигация
- Респонсивная верхняя навигация
- Разделенная навигация
- Навигационная панель с иконками
- Меню поиска
- Полоса поиска
- Фиксированная боковая панель
- Боковая навигация
- Респонсивная боковая панель
- Полное навигационное меню
- Меню за пределами канвы
- Кнопки боковой навигации при наведении
- Боковая панель с иконками
- Горизонтальное скролируемое меню
- Вертикальное меню
- Нижнее меню
- Респонсивное нижнее меню
- Низкая граница навигационных ссылок
- Справа отцентрированные ссылки меню
- Центрированные ссылки меню
- Меню с равной шириной ссылок
- Фиксированное меню
- С下滑анием навигационной панели при скролле
- Скрытие навигационной панели при скролле
- Сокращение навигационной панели при скролле
- Прилипающая навигационная панель
- Навигационная панель на изображении
- Выпадающее меню при наведении
- Выпадающее меню по单击у
- Каскадное выпадающее меню
- Выпадающее меню в верхней навигационной панели
- Выпадающее меню в боковой навигационной панели
- Респонсивная навигационная панель с выпадающим меню
- Подменю с навигацией
- Выпадающее меню
- Суперменю
- Перемещаемое меню
- Шторка меню
- Складывающаяся боковая панель
- Складывающаяся боковая панель
- Страницация
- Меню с хлебными крошками
- Группа кнопок
- Вертикальная группа кнопок
- Прилипающая социальная панель
- Капсульная навигация
- Респонсивный заголовок
- Слайд
- Галерея слайдов
- Модальное изображение
- Фонокопия
- Респонсивная сетка изображений
- Сетка изображений
- Галерея изображений
- Перетаскиваемая галерея изображений
- Панель с вкладками для изображений
- Закрытие наложенного изображения
- Перетаскивание наложенного изображения
- Изображение наложенного изображения с масштабированием
- Заголовок наложенного изображения
- Иконка наложенного изображения
- Эффект изображения
- Черно-белое изображение
- Текст изображения
- Текстовый блок на изображении
- Прозрачный текст на изображении
- Полная страница изображения
- Форма на изображении
- Фокусное изображение
- Размытый фон изображения
- Изменение фона при скролле
- Изображения в ряд
- Изображение с закругленными углами
- Изображение профиля
- Респонсивное изображение
- Центрированное изображение
- Эскиз
- Рамка изображения
- Презентация команды
- Прилипающие изображения
- Переворачиваемые изображения
- Дрожащие изображения
- Галерея работ
- Сортируемая галерея работ
- Увеличение изображения
- Лупа для изображения
- Слайдер для сравнения изображений
- Иконка сайта
- Кнопки с предупреждением
- Кнопки с профилем
- Разделительные кнопки
- Анимационные кнопки
- Кнопки с градиентом
- Кнопки на изображении
- Кнопки социальных сетей
- Читать больше/Читать меньше
- Кнопка загрузки
- Кнопка загрузки
- Капсульные кнопки
- Кнопка уведомления
- Иконка кнопки
- Кнопки «Следующая страница/Предыдущая страница»
- Дополнительные кнопки в навигации
- Блочные кнопки
- Текстовые кнопки
- Круглые кнопки
- Кнопка возврата к началу страницы
- Форма входа
- Форма регистрации
- Таблица для расчета
- Форма связи
- Таблица для социальных логинов
- Регистрационная форма
- Форма с иконкой
- Подписка на новости
- Стековая форма
- Респонсивная форма
- Выпрыгивающая форма
- Встроенная форма
- Очистка поля ввода
- Скрытие цифровых стрелок
- Копирование текста в буфер обмена
- Анимационный поиск
- Кнопка поиска
- Полное поисковое окно
- Поле ввода в навигационной панели
- Форма входа в навигационной панели
- Настройка флажков/радиокнопок
- Настройка списка выбора
- Переключение переключателя
- Выбор флажка
- Обнаружение включения верхнего регистра
- Извлечение кнопки с помощью клавиши Enter
- Проверка пароля
- Переключение видимости пароля
- Многошаговая форма
- Автоматическое завершение
- Отключить автоматическое завершение
- Отключить проверку правописания
- Кнопка загрузки файла
- Проверка пустого ввода
- Окно видео на весь экран
- Модальное окно
- Удаление модального окна
- Линия времени
- Индикатор скроллинга
- Прогресс-бар
- Скилбар
- Ползунок диапазона
- Выбор цвета
- Поле электронной почты
- Подсказка
- Отображение элементов при наведении
- Пopping окно
- Сворачиваемое содержимое
- Календарь
- HTML включение
- Список задач
- Загрузчик
- Бейдж
- Оценка звезд
- Оценка пользователей
- Эффект покрытия
- Контактный чип
- Карточка
- Переворачиваемая карточка
- Карточка профиля
- Карточка продукта
- Предупреждение
- Пупырка
- Заметка
- Тег
- Лента
- Облако тегов
- Круг
- Дизайнерская линия
- Купон
- Список групп
- Список с значками
- Список без маркеров
- Responsive текст
- Тень текста
- Сияющий текст
- Фиксированный подвал
- Прилипающий элемент
- Однородность
- Очистка плавающего
- Responsive плавающий
- Лента уведомлений
- Окно на весь экран
- Скроллинг рисования
- Smooth скроллинг
- Роликовый фоновый градиент
- Прилипающая шапка
- Сжатие заголовка при скроллинге
- Таблица цен
- Параллакс скроллинг
- Соотношение сторон
- Responsive inline фрейм
- Переключение нравится/не нравится
- Переключение скрытого/видимого
- Переключение темного режима
- Переключение текста
- Переключение класса
- Добавление класса
- Удаление класса
- Изменение класса
- Активный класс
- Деривационная модель
- Удаление дроби
- Удаление атрибута
- Проверка работы в оффлайн
- Найти скрытый элемент
- Перенаправление веб-страницы
- Форматирование чисел
- Масштабирование при наведении
- Перевернутый короб
- Вертикальное центрирование
- Центрированный кнопка в DIV
- Центрированный список
- Трансформация при наведении
- Стрелка
- Форма
- Ссылка для загрузки
- Элементы полного размера
- Окно браузера
- Настройка полосы прокрутки
- Скрыть полосу прокрутки
- Показывать/Форсировать показ полосы прокрутки
- Внешний вид устройства
- Рамка редактируемого содержимого
- Цвет占位符
- Запрещение изменения размера текстовой области
- Запрещение выбора текста
- Цвет выбора текста
- Цвет маркеров списка
- Вертикальная линия
- Разделитель
- Разделитель текста
- Анимационная иконка
- Контактный таймер
- Эффект пишущей машинки
- Страница, готовящаяся к запуску
- Сообщения чата
- Пopping окно чата
- Раздел экрана
- Отзывы клиентов
- Блочный счетчик
- Цитата слайд
- Закрываемый элемент списка
- Типичные устройства разрывы
- Перетаскиваемый элемент HTML
- JS Медиа-запрос
- ЯзыковойHighlighter
- JS Анимация
- JS Длина строки
- JS Вычисление показателей
- JS По умолчанию параметр
- JS Случайное число
- JS Нумерический массив сортировки
- Как использовать расширительный оператор на JavaScript
- Как скроллить до просмотра на JavaScript
- Как получить текущую дату
- Как получить текущий URL
- Как получить текущий размер экрана
- Как получить элемент iframe
- Предыдущая страница Шкатулка CodeW3C.com
- Следующая страница Панель иконок