В этом анонсе я хочу познакомить вас с нашим развивающимся сайтом и сообществом - css-live.ru.
Как зарождалась идея
Несколько лет назад я зарегистрировался на одном из профессиональных форумов. К тому моменту веб-разработка для меня была скорее как хобби. Мой жизненный максимализм помог мне быстро освоиться и втянуться в сам процесс. Со временем хобби начинало перерастать в основную профессию, а в итоге и стало таковым.
Собственное контекстное меню довольно редко применяется в интерфейсе веб-страницы. Ведь пользователю совершенно не очевидно, что на каком-то элементе надо щёлкнуть не левой, а правой кнопкой мыши и выбрать пункт из списка. К тому же не все посетители сайтов любят использовать правую кнопку мыши, а на смартфонах её вообще нет, только имитация. Несмотря на эти особенности в HTML5 есть возможность создавать собственные контекстные меню, реализовано это пока только в Firefox, и то весьма своеобразно.
Многие веб-разработчики игнорируют матрицу преобразований, полагая её слишком сложной для понимания и используя взамен простейшие функции для трансформации. И совершенно зря, матрица преобразований обладает широкими возможностями, вдобавок, в том или ином виде поддерживаются всеми браузерами, а значит её применение даёт кроссбраузерный код. Так что давайте разбираться, что это такое и как использовать матрицу преобразований на практике.
Raphaël это мощная библиотека, которая должна упростить работу с векторной графикой в Интернете. Сегодня я научу вас, как создать интерактивную карту с нуля.
Дорогие друзья, поздравляю вас с наступающим Новым годом и желаю творческих побед, новых знаний и успехов в жизни.
В честь праздника от сайта htmlbook.ru небольшая акция, которая продлится до 15 января. Вы можете одновременно приобрести обновлённый справочник по CSS и книгу Рецепты CSS за полцены (40 рублей).
Разрешение мониторов постоянно растёт и при вёрстке веб-страниц приходится учитывать самый широкий диапазон разрешений. Это особенно важно при использовании фонового рисунка, который либо обрезается при низком разрешении монитора, либо, наоборот, целиком не помещается при высоком разрешении. Одним из решений подобной ситуации является масштабирование фона. Конечно, это сулит некоторые неприятности вроде появления искажений и артефактов в изображениях, но и расширяет арсенал средств вёрстки.
За управление размером отвечает свойство background-size, в качестве значения можно указывать ключевое слово cover, тогда размер изображения будет такой, чтобы его ширина и высота поместились в заданную область (например, окно веб-страницы); ключевое слово contain масштабирует картинку так, чтобы хотя бы одна сторона картинки целиком поместилась в заданную область. Кроме того, допустимо указывать явные размеры по горизонтали или вертикали в процентах или других единицах CSS. На рис. 1 показано изменение размеров изображений при разных значениях background-size. Серым цветом выделен блок размером 280х200 пикселов внутри которого устанавливается фон.
Доступна новая платная цифровая книга «Рецепты CSS» представляющая собой сборник ответов на типовые вопросы по CSS и HTML. Все примеры выполнены на HTML5, активно используется CSS3. Кроме самих рецептов приведены двух и трёхколоночные типовые макеты для вёрстки.
Стоимость 50 рублей, доступны два формата: chm для просмотра в Windows и в виде набора html-файлов для любой платформы.
На форуме htmlbook.ru объявлен очередной мини-конкурс по использованию свойств CSS3 для рисования на тему «Сады Семирамиды». Работы принимаются до 14 ноября. Правила конкурса и подробности смотрите в этой теме.
Радиальные по своему принципу похожи на линейные градиенты, но один цвет переходит в другой не вдоль прямой линии, а словно круги по воде вокруг точки. На рис. 1 представлено одновременно два разных градиента: радиальный (рис. 1а) и линейный (рис. 1б).
Градиентом называют плавный переход от одного цвета к другому, причём самих цветов и переходов между ними может быть несколько. С помощью градиентов создаются самые причудливые эффекты веб-дизайна, например, псевдотрёхмерность, блики, фон и др. Также с градиентом элементы смотрятся более симпатично, чем однотонные.
Традиционные прямоугольные уголки в дизайне сайтов давно уже всем надоели. В моде скруглённые уголки, которые делаются не с помощью изображений, а через стили, для чего используется свойство border-radius. Это свойство может иметь одно, два, три или четыре значения разделённых пробелом, которые и определяют радиус всех уголков или каждого по отдельности.
Эффект полупрозрачности элемента хорошо заметен на фоновом рисунке и получил распространении в разных операционных системах, потому что смотрится стильно и красиво. В веб-дизайне полупрозрачность также применяется и достигается за счёт свойства opacity или формата цвета RGBA, который задаётся для фона.
