HTML и CSS

Примеры использования :nth-child

Примеры использования :nth-child

В одной из предыдущих статей мы с вами познакомились с замечательными псевдоклассами :nth-child и :nth-of-type, а также разобрали их отличия. Данную же статью мы посвятим разбору практических примеров, где и как можно применять эти псевдоклассы.

Flexbox. Введение

Flexbox. Введение

Flexbox (флексбокс) — это новый модуль, который есть в CSS3, предназначенный для более эффективной верстки за счет гибкого расположения элементов, как по горизонтали, так и по вертикали. В этой серии уроков мы изучим базовые основы работы с данным модулем.

nth-child и nth-of-type

Разбираем nth-child и nth-of-type

Псевдокласс :nth-child и :nth-of-type — очень полезный инструмент для выборки нужных элементов без использования jQuery. В данный статье я хотел бы поговорить о разнице между этими двумя псевдоклассами.

Google Maps. Добавить множество маркеров

#4. Google Maps. Добавить множество маркеров

Мы с вами научились добавлять один маркер на карту, но на практике чаще всего требуется добавлять множество маркеров и вот о том, как это сделать, пойдет речь в данной статье.

Google Maps. Информационные окна

#3. Google Maps. Информационные окна

Информационное окно — это всплывающая подсказка, которая отображается в указанной точке на карте. Ниже я показываю пример, как можно добавить информационное окно для нашего маркера.

Добавляем маркер на карту Google

#2. Добавляем маркер на карту Google

Маркеры — это произвольные метки, показывающие расположение того или иного объекта на карте. Чаще всего Google карту добавляют на сайт именно для того, чтобы на ней вывести эти самые маркеры, которые к примеру будут указывать адреса магазинов или что-то в этом духе.

Как вставить карту Google на сайт

#1. Как вставить карту Google на сайт

Google Maps API v3 позволяет легко и просто добавить карту на любую страницу вашего сайта, даже если вы не особо владеете языком JavaScript. Также встроенную карту можно очень гибко настраивать, менять цветовое решение, добавлять маркеры, всплывающие подсказки и т.д. В общем, возможностей масса и вот как раз о самых основных из них, я хотел бы рассказать и показать на примерах, как реализовать. Первый урок мы посвятим теме «Как установить Google Maps на сайт?»

Стилизация checkbox и radio на CSS

Стилизация checkbox и radio на CSS

В этой статье мы научимся менять внешний вид checkbox и radio-кнопок на чистом CSS. Разумеется способ уже достаточно не новый и поэтому проверенный. Я его неоднократно применял при верстке различных сайтов.

Высота равная ширине на CSS

Высота div равная ширине на CSS

В этом уроке мы научимся верстать блок у которого высота будет равна его ширине и соответственно, если мы изменим размеры окна браузера, то данный блок также будет адаптироваться и менять свои размеры, оставляя при этом свое соотношение сторон.

Меняем активный пункт меню при прокрутке страницы

Меняем активный пункт меню при прокрутке страницы

Очень часто на одностраничниках можно встретить такую фишку, когда начинаешь прокручивать страницу, верхнее меню плавно едет за вами и в зависимости от того, какой вы сейчас раздел просматриваете, будет выделен соответствующий пункт меню. Прочитав эту статью, вы научитесь делать подобного рода менюшки.

Наверх

Скачивание материалов доступно
только подписчикам!

Если вы подпишитесь, то сможете сразу же получить доступ ко всем материалам этого блога

Подписка бесплатная и займет у вас
не более 1 минуты

Получение доступа к материалам

Для получения доступа, заполните форму ниже. Введите свое настоящее имя и e-mail

« Вернуться назад

Проверьте свой почтовый ящик

и подтвердите подписку

После этого вы сразу же получите доступ ко всем материалам этого блога

Введите e-mail, который вы указывали при подписке

Мы проверим его по базе подписчиков и если вы на самом деле подписывались, то доступ для вас сново будет открыт

« Вернуться назад