HTML, CSS, JS, PHP
HTML
CSS уроки
- Как использовать CSS
- Единицы измерения CSS (px, %, em, vw, vh, vmin, vmax) и функция calc
- CSS селекторы.
- Пробел между классами и без него
- Псевдоклассы CSS.
- :focus CSS
- :focus-within CSS
- :target CSS
- :empty и :blank CSS
- Как скрыть/показать текст щелчком мышки на ссылки.
- :before, :after и другие псевдоэлементы CSS.
- input :before или :after
- Наследование CSS (inherit initial unset), свойство all
- Как выровнять div по центру в HTML
- Блоки, размещённые по центру, равномерно смещаются вниз
- Выровнять текст, картинки или блоки div по ширине
- Как выровнять текст по вертикали
- Выравнивание по правому краю
- Как сделать, чтобы одна ссылка или часть текста находилась слева строки, а другая справа?
- Изображение по середине
- Вертикальный текст (свойство writing-mode)
- Как сделать разный стиль у букв CSS.
- Прозрачность в CSS
- Перенос слов CSS (свойства overflow-wrap, word-wrap, word-break, hyphens)
- Перенос текста CSS (свойство white-space)
- Как обрезать элемент на CSS (свойства overflow, text-overflow и clip)
- Чем отличаются display block от inline и table css.
- Невидимый элемент в CSS (свойство visibility)
- Доступно про float: left и как равномерно разместить блоки div на CSS.
- Как сделать CSS колонки: примеры с текстом и изображением.
- Колонки (div и др.блоки) одинаковой высоты
- Позиционирование CSS.
- Поток HTML документа (position: static;)
- Сдвинуть блок (position: relative;)
- Наложение (position: absolute;)
- position: fixed; - как зафиксировать HTML-элемент в окне браузера.
- Закрепить блок при прокрутке (position: sticky;)
- z-index
- Разница между фиксированной, резиновой, адаптивной и отзывчивой вёрсткой
- Резиновый сайт
- Блок на весь экран
- Картинка или видео по размеру экрана на CSS
- Не работает max-width для img внутри table
- Изображение внутри iframe
- Две картинки рядом: как они себя поведут при уменьшении окна браузера
- Flexbox
- Размер flex-элемента (свойство flex: flex-grow, flex-shrink, flex-basis)
- Порядок следования flex-элементов (свойство flex-flow: flex-direction, flex-wrap)
- Порядок следования flex-элемента (свойство order)
- Как прижать футер к низу резиновой страницы
- Сделать ширину сайта для разных разрешений монитора.
- Вывод на печать страницы сайта/блога.
- Кернинг (свойство font-kerning)
- Расстояние между буквами (свойство letter-spacing)
- Расстояние между словами (свойство word-spacing)
- inline-элементы без пробелов в родителе при переполнении
- Отступ первой строки (свойство text-indent)
- Межстрочный интервал (свойство line-height)
- Вертикальное выравнивание текста (свойство vertical-align)
- Боксовая модель CSS и свойство box-sizing
- Как задать отступы CSS (свойства margin и padding)
- css рамка
- Граница (свойство border)
- Рамка картинкой (свойство border-image)
- Закругленные углы (свойство border-radius)
- Рамка и отступы HTML-таблицы (свойства border-spacing, empty-cells, border-collapse)
- Контур (свойство outline)
- Как сделать тень css с примерами - свойство box-shadow
- Подчёркнутый текст (свойство text-decoration)
- Фон для сайта CSS.
- Как сделать градиенты на CSS.
- Круговая диаграмма с conic-gradient
- CSS тень текста.
- Градиент у текста
- Контур вокруг каждой буквы (свойство text-stroke)
- Мигающий текст
- Ещё образцы тени (свойство box-shadow ).
- Курсор мыши в виде руки.
- Запретить/разрешить выделение текста (свойство user-select)
- Нумерация в CSS
- Автоматическая нумерация строк таблицы
- Прокрутка CSS
- Плавная прокрутка к якорю (свойство scroll-behavior)
- Страница не прыгает при появлении скролла (свойство scrollbar-gutter)
- Как убрать горизонтальную полосу прокрутки
- Прокрутка только модального окна, а не всей страницы
- Индикатор прокрутки страницы
- Трансформация CSS.
- transform CSS.
- Трапеция
- CSS поворот.
- transform-origin CSS.
- Анимация CSS.
CSS примеры
JavaScript
- Вставить JavaScript в HTML страницу.
- Получить значение value из тега input в JavaScript
- Как объединить два события
- Остановить выполнение функции
- Кавычки, косая черта, в JavaScript.
- :hover
- Document.title: узнать или изменить title страницы
- Window.location: узнать URL текущей страницы, перезагрузить документ, перейти на другую страницу в текущей вкладке
- Document.referrer: узнать с какого URL пришёл посетитель
- Открытие нового окна window.open() или одной страницы внутри другой с помощью iframe
- Параметры URL
- Контент с другой страницы
- Как запретить переход по ссылке
- Отключить onclick для дочернего элемента
- Сохранение заполненных полей, нажатых кнопок, открытых блоков на JavaScript
- How to stop page load
- Как сделать заставку на сайт
- Всплывающее окно при входе на сайт
- AdSense для адаптивного и отзывчатого дизайна
- parseInt
- Регулярные выражения
- Как создать элемент, а потом его же удалить: appendChild(), removeChild()
- Атрибуты: как добавить, изменить значение, удалить
- Стили CSS: как узнать, добавить, изменить, удалить селектор или его значение
- Как изменить или удалить :before и :after с помощью JavaScript
- textarea и innerHTML в Internet Explorer
- Перебор for
- Фильтрация
- Смена текста
- Сменяющийся текст скрипт jQuery.
- Как автоматически подменять слово на картинку.
- Упорядочить таблицу по алфавиту на скрипте Javascript.
- Форма с вкладками без подключения библиотек.
- Прокрутить страницу при загрузки к id
- Плавная прокрутка страницы до якоря
- Как сместить содержимое iframe
- Как сделать ссылку к началу страницы (ссылку "Наверх")
- Прилипающий блок при скроллинге (прокрутки страницы)
- Координаты курсора мышки внутри элемента (div, img) | JavaScript
- Скрипт скорости загрузки сайта.
- Увеличить уменьшить размер шрифта текста.
- Скрипт калькулятора стоимости
- Последний день месяца, сколько дней в году, сколько дней осталось до конца года
- Количество недель в году, получение номера недели по дате
- Прибавить к дате день / месяц / год
- Сравнение дат на JavaScript
- Определение возраста
- Узнать число плавающей даты (праздника)
- Календарь для сайта
- Автоматическое заполнение формы
- Озвучить: SpeechSynthesis
Инструменты, конвертеры, калькуляторы на JavaScript
PHP
YouTube
SVG