HTML/CSS

Появление элемента в области просмотра браузера
Отследить появление блока при скроллинге можно с помощью события onscroll, вычисляя его положение методами jquery...
58232
+12
Manifest.json
Файл манифеста содержит информацию об иконках, цветовой теме, ориентации экрана, начальном URL и т.д.
11019
+1
CSS стили выделенного текста
::selection или ::-moz-selection – псевдоэлемент, который отвечает за стили выделяемой области текста.
8942
0
Полупрозрачный градиент поверх картинки
Такой эффект можно сделать с помощью :before у родительского элемента. Поверх изображения помещается абсолютный блок с...
75448
+8
Сборник CSS градиентов
Подборка 23-х фонов с линейным и радиальным градиентом.
100839
+12
Адаптивные блоки YouTube
Видео YouTube вставляется через iframe, но он не адаптивен по высоте. Если задать width="100%", то он растянется на всю ширину родителя, но для высоты hight="100%" не работает.
11371
+4
Адаптивное выравнивание изображений на всю ширину браузера
Простой пример как адаптивно выстроить несколько изображений на всю ширину окна браузера.
19628
-2
Плавное появление страниц сайта
Эффект плавного появления страницы хорошо подходит для рекламных сайтов и лэндингов. Сделать его можно с помощью CSS...
20296
+2
Ускорение загрузки Яндекс Карт
Несколько рекомендаций как увеличить скорость загрузки API Яндекс.Карт 2.0.
31858
+13
Горизонтальное меню justify
В отличии предыдущего меню, где есть отступы у каждого элемента, часто возникает задача сделать резиновое меню без них. Пункты меню должно идти с одинаковыми интервалами и без отступов по бокам.
10540
-1
Рамка у отдельных ячеек таблицы
Метод добавления рамки к отдельным ячейкам, столбцам и строкам таблиц. К ячейке таблицы добавляются position: relative...
19235
0
Верстка блока контактов с картой
Пример, как вывести Яндекс карту на всю ширину сайта + плавающий блок с контактной информацией.
25278
-1
Фиксированное горизонтальное меню с активными пунктами
Пример горизонтального меню для лэндингов, в котором реализовано...
15739
+2
Модальное окно на затемненном фоне
Для модальных окон есть множество плагинов такие, как fancybox, Twitter Bootstrap и т.д. Но бывают случаи когда нет...
76969
+25
Показать/скрыть блок текста на jQuery
Примеры как на jQuery и показывать скрывать определенный текст по клику на ссылку или кнопку.
85291
+22
Шахматное поле на CSS
Приемы как сделать шахматную сетку на псевдо-свойстве :nth-child().
37393
0
Селект с чекбоксами
Селект с множественным выбором (select multiple) весьма не удобен, при выборе часто забываешь нажимать сtrl и все сбрасывается. В место него можно использовать чекбоксы в выпадающем списке.
60695
+14
Текст с градиентом
Градиент в цвет шрифта можно добавить с помощью CSS свойства background-clip: text, которое окрашивает текст в цвет или изображение указанного в background-image.
68428
+5
СSS стили для горизонтальных линий
Сборник горизонтальных линий с тегом hr разных видов и стилей.
174131
+9
Наложение градиента на изображение
Еще один способ сделать эффект смешивания градиента и изображения, основан на свойстве background-blend-mode. Минус...
11463
+2
Favicon
Favicon – иконка сайта, выводится во вкладке браузера и поисковой выдаче Яндекса.
11839
0
Подчеркивание текста линией с градиентом
Подчеркивание текста можно сделать с помощью нескольких свойств CSS - background-image, background-size и...
11889
+1
Изменение цвета Яндекс карт
Цвет карты можно изменить начиная с версии 2.0 с помощью CCS фильтров, применив их к элементу .ymaps-layers-pane
83602
+4
После отправки формы сохранить позицию скролла
В больших формах, с несколькими кнопками «Отправить/сохранить» есть одна проблема – после ее отправки браузер обновит...
13819
+3
Фильтры Instagram на CSS
Сборник CSS стилей с эффектом фильтров Инстаграма.
9644
0
Добавление CSS стилей на страницу
Несколько примеров как добавить CSS-свойства к HTML странице.
6144
-1
Open Graph
Микроразметка используется для превью страницы, которое формируется при публикации ссылки в социальных сетях. Поддерживается в Facebook, VK, Однокласниках. Яндекс и гугл использует Open Graph в...
7264
+2
Разметка страниц для Twitter (Twitter Cards)
Разметка вставляется в head каждой страницы сайта и используется для расширенного описания ссылки, вставленной в твит.
13045
0
Подключение и выполнение JavaScript на странице
Несколько примеров как подключить JS скрипты к web страницам и некоторые тонкости.
12491
-4
Мета-теги HTML для Apple Safari
Обзор html мата-тегов для браузеров Safari на платформах Mac OS X и iOS.
23880
+2