Сейчас в мировом веб-дизайне по-большей части преобладает плоский стиль оформления интерфейса пользовательских элементов управления. Плоские панели навигации, блоки с содержанием и конечно же, неотъемлемый элемент любого сайта — кнопки. Я нераз уже подробно расписывал варианты создания кнопок с помощью CSS3, разных форм и расцветок. Сегодня хочу показать вам простейший пример создания большой объёмной кнопки в стиле…
В последнее время в веб-дизайне становится очень популярным использование круглых изображений. Пример можно увидеть у меня на блоге, миниатюры к записям выводятся максимально скругленные, то есть абсолютно круглыми. Существуют разные способы реализации вывода круглых картинок. Проверенный годами, работающий во всех браузерах без исключения, это предварительная подготовка изображений в графическом редакторе, когда из стандартной картинки выделяется…
В качестве шпаргалки, собрав информацию из разных источников, составил вот такой, небольшой набор стандартных правил css медиа-запросов, для различных типов пользовательских устройств и режимов их ориентации, в зависимости от положения телефона или планшета в руках пользователя. Так в портретном режиме portrait, когда высота превышает длину, и в альбомном режиме landscape, когда ширина больше высоты, ну…
Знаете ли вы, что тег <style>по сути своей является таким же блочным элементом? Он так же, как и другие элементы может быть отображен на странице со всем содержимым! Более того, отображен не в виде привычного всем демо-кода, а в качестве простейшего визуального редактора фактических стилей CSS используемых на странице. Оказывается всё очень просто, используя атрибут…
Недавно довелось мне оформлять простенькую, представительскую страницу для одной районной библиотеки. Заказчик пожелал видеть параграфы с использованием буквицы в заглавии каждого из них. Способы создания буквицы известны очень давно и хорошо отработаны, так что с выполнением работы никаких затруднений не возникло. Завершив работу, решил не отбрасывать в сторону материал, а пополнить им коллекцию сниппетов на…
Часто спрашивают, какой самый простой способ реализации подсказок к ссылкам. Самый простой, это не особо заморачиваясь по поводу внешнего вида подсказок, использовать встроенные средства браузеров, прописывая атрибут title=”” в ссылках. В то же время существует масса других способов создания простых всплывающих подсказок, о некоторых из них я писал ранее, да и в «интернетах» материала по…
Как оригинально оформить изображения в момент взаимодействия с пользователем? То есть как-то интересно выделить картинку при наведении на неё указателя мыши. Технических решений этой задачи предостаточно и расписаны они в мельчайших подробностях. Так что нового ничего не открою, а просто-напросто поделюсь простеньким фрагментом кода CSS, который в разных вариация часто использую сам. Для создания привлекательного…
Существует немало решений для реализации эффекта печатающегося текста с помощью javascript. На jQuery например, можно с текстом выписывать такие кренделя, что диву даёшься. Но меня всегда интересует возможность выполнения той или иной задачи с помощью свойств CSS3, конечно только тогда, когда это оправданно и не несёт явных потерь в общей картине конечного результата. На одном…
При добавлении текстового поля созданного через тег <textarea> на отдельную страницу или в запись, в современных браузерах по умолчанию присутствует еле заметный уголок с помощью которого мышью пользователям представляется возможность изменить размеры поля ввода. В некоторых случаях(по разным причинам) возникает необходимость определить направление изменения размеров текстовых полей по горизонтали и вертикали, или же вовсе запретить…
Простейший способ создать эффективную панель вкладок без использования каких-либо javascript и изображений. Самое простое решение из всех, которые я встречал. Ничего лишнего, минимум кода и, компактный блок с переключаемыми вкладками легко интегрируется в любой макет страницы. Экспериментируя с параметрами свойств CSS, вы всегда сможете сформировать внешний вид вкладок, так чтобы они гармонично вписывались в общий…
Приобретая данный курс, вы получаете целостный продукт, в котором есть всё необходимое для изучения и работы с WordPress
