Dobrovoi Master
сделано с душой

В состоянии постоянного подключения...
Главная » Записи по метке: css

Абсолютное центрирование отзывчивого изображения на CSS

Для абсолютного горизонтального и вертикального центрирования элементов на странице предлагаются различные методы, например, на Хабре, ещё в 2013г был представлен перевод отличной статьи с решением от Стефана Шоу, написанной в своё время для Smashing Magazine. Так что, в этом плане, ничего нового не открою, с центрированием элементов всё предельно ясно.Однажды, при разработке очередного лайтбокса, мне понадобилось сделать так чтобы ...

Отзывчивый Аккордеон на чистом CSS

В своих статьях, я не раз уже касался темы создания блоков в стиле "аккордеон", как на чистом CSS, так и с использованием jQuery, но каждый раз возвращаюсь, ищу новые решения, экспериментирую пытаясь найти вариант одинаково хорошо работающий на всех устройствах, во всех браузерах, и был максимально понятен любому веб-мастеру, для реализации в своих новых проектах.Сегодня хочу представить очередной вариант "аккордеона". На этот раз это будет ...

Выделение внешних ссылок с помощью CSS

Выделение внешних ссылок с помощью CSS При написании статей мы так или иначе нет-нет да используем ссылки на внешние сайты, это могут быть ссылки на первоисточники, различные веб-приложения, каталоги и т.д. Большинство из нас никак не выделяет внешние ссылки, чаще ограничиваясь атрибутом target="_blank" в ссылке, определяющим открытие этой самой ссылки в новом окне, ну, или же стандартные подсказки через атрибут title. Давайте рассмотрим простейший пример того, как с помощью ...

Адаптивные изображения с помощью CSS

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

Стили CSS для форм обратной связи

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

Абсолютно круглые изображения с помощью CSS

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

Пример адаптивной верстки Портфолио с фильтрацией работ на jQuery

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

Доработал стили для панели постраничной навигации

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

Круглые кнопки панели постраничной навигации

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

Набор стилей для формирования постраничной навигации сайта на CSS3

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

Кроссбраузерный «аккордеон» с помощью CSS3

Кроссбраузерный «аккордеон» с помощью CSS3 В последнее время, в силу того, что практически все современные и популярные браузеры (Opera, Firefox, Safari, Chrome, Flock и даже вечный тормоз - IE), активно подключаются к поддержке новых свойств CSS3, стало возможным в плотную заняться разработкой, более-менее кроссбраузерного, компактного "аккордеона", раскрывающегося при наведении. Конечно, способов создания таких "гармошек", в интернетах можно найти на любой вкус и цвет, все они разные и ...

Создаем выпадающее меню навигации на CSS3

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

10 Уроков по созданию отличных меню навигации для ваших сайтов

10 Уроков по созданию отличных меню навигации для ваших сайтов В своей работе, немало времени уделял разработке различных видов меню навигации для сайтов, как с применением jQuery, так и используя чистый стиль CSS3 без дополнительных изображений и подключаемых javascript. Решил все наработки по теме собрать воедино и выложить в качестве своеобразной подборки уроков по созданию меню навигации. В обзоре представлены разные типы меню, по стилю исполнения и функционалу, многоуровневые с выпадающими подменю, ...

Чистый стиль меню с помощью CSS3

Чистый стиль меню с помощью CSS3 Всем снова здравствуйте! В своих статьях, я не раз обращался к различным способам создания навигационных меню для сайтов. Рассматривались менюшки на любой вкус и цвет, навигация в популярном стиле "аккордеон", горизонтальные и вертикальные, с использованием javascript и картинок, не мало внимания уделялось многоуровневым меню на jQuery. Как вы понимаете способы создания меню ограничены лишь фантазией разработчиков, а она у них воистину ...
1 2 3
Рейтинг@Mail.ru