Серия «Актуальные книги для тех, кто создает сайты», книга.
Манн, Иванов и Фербер; Москва; 2013. ISBN 978-5-91657-595-8. Аннотация.
CSS3 – будущее веб-разработки, новый стандарт оформления документов, расширяющий возможности предыдущего стандарта CSS
2. Многие возможности, которые ранее были труднодоступными, в CSS3 могут просто достигаться за счет использования новых свойств оформления.
Абсолютные преимущества технологий нового поколения – на высоте. Прежде всего, простота и легкость – для программистов, а удобство и комфорт – для пользователей.
Книга Дэна Сидерхолма поможет вам использовать CSS3 прямо сейчас, применяя технологии, появившиеся в новых стандартах. На примере дизайна веб-страницы автор показывает применение всех, изложенных в книге, инструментов. Предисловие.
CSS3 сегодня.
Не читайте спецификации.
CSS3 – для всех.
Целиться на взаимодействие.
Когда применять CSS вные свойства CSS3, применимые сейчас.
border-radius.
text-shadow.
box-shadow.
Несколько фоновых изображений opacity.
RGBA.
Какие темы не будут затронуты.
Префиксы конкретных браузеров.
Как работают браузерные префиксы.
Оптимальный порядок.
Не пугайтесь браузерных префиксов!
А как насчет повторений?
Переходы в CSS.
Хвост, который размахивает собакой.
Что такое CSS-переходы.
Простой пример.
Временные функции (мне следовало быть внимательнее на уроках математики).
Задержка перехода.
Краткая форма записи.
Краткая форма записи перехода с задержкой.
Поддержка в браузерах.
Полная запись перехода.
Состояния перехода.
Переход нескольких свойств.
Переход всех возможных состояний.
К каким свойствам применим переход.
Почему бы не воспользоваться JavaScript?
Используйте с умом.
Hover по-новому.
Наш пример.
Сообщения в космосе и в вебе.
Удивление и восторг.
Должны ли сайты выглядеть полностью одинаково в каждом браузере?
Навигация на Луне.
Сначала разметка.
Сдвинем элементы.
Определение цвета ссылки – RGBA 43Д. Сидерхолм. «CSS3 для веб-дизайнеров».
Запасной вариант для RGBA.
Добавим text-shadow.
Оформление состояний hover и focus.
Скругление углов: border-radius.
Добавим анимацию.
Построение взаимодействия.
Простой и гибкий hover с использованием opacity.
Прозрачность на кликабельных картинках.
Разметка.
Прозрачность и эффективность картинки.
Оформление списка opacity: хак для IE.
Добавим переход.
Вперед, к новому hover.
Преобразовывая содержимое.
Масштабирование.
Добавим стиль.
Масштабирование в hover.
Подходящая тень.
Сгладим масштабирование переходом.
Преобразовывая взаимодействие.
Поворот, кручение, сдвиг.
Добавим поворот.
Нет поворота? Паника ни к чему.
Повернутое Солнце.
Кручение (skew).
Сдвиг (translate).
Разные преобразования, помогающие поддержать рассказ.
Преобразования Луны.
Поддержка сообщения.
Разметка.
Основные стили для каждого предмета.
Общее правило.
Масштабируем большой пончик.
Перспектива: масштабирование и позиционирование.
Ускользающая космическая кошка.
Откидное кресло.
Исчезающий гном.
Безопасное упрощение.
Еще раз: используйте с умом.
Побольше «вау-вау», пожалуйста.
Множественные фоны.
Параллакс.
Старый способ: дополнительная разметка.
Новый способ: множественные фоны на CSS.
Синтаксис множественного фона.
Поддержка в браузерах.
Запасной вариант для всех браузеров.
Использование множественных фонов 91Д. Сидерхолм. «CSS3 для веб-дизайнеров».
Улучшенные формы.
Разметка для простой формы регистрации.
Стили для полей и подписей.
Больше CSS3-селекторов.
Оформление полей ввода.
Градиенты в CSS.
Настоящая кнопка на CSS.
Основные стили для кнопки.
Скругление углов.
Линейный градиент.
text-shadow.
Тень на кнопке.
А как насчет других браузеров?
Использование box-shadow для создания состояния focus.
Добавление CSS-анимаций для улучшения взаимодействия с формой.
Ключевые кадры.
Ссылки на keyframe.
Повторное использование анимации для кнопки в состоянии hover.
А как насчет остальных браузеров?
Сосредоточьтесь на взаимодействии.
Заключение.
А как насчет заказчиков и руководителей, которые не понимают этого?
Что дальше?
Дополнительные материалы и ресурсы.
Об издательстве A Book Apart.
Об авторе.
Манн, Иванов и Фербер; Москва; 2013. ISBN 978-5-91657-595-8. Аннотация.
CSS3 – будущее веб-разработки, новый стандарт оформления документов, расширяющий возможности предыдущего стандарта CSS
2. Многие возможности, которые ранее были труднодоступными, в CSS3 могут просто достигаться за счет использования новых свойств оформления.
Абсолютные преимущества технологий нового поколения – на высоте. Прежде всего, простота и легкость – для программистов, а удобство и комфорт – для пользователей.
Книга Дэна Сидерхолма поможет вам использовать CSS3 прямо сейчас, применяя технологии, появившиеся в новых стандартах. На примере дизайна веб-страницы автор показывает применение всех, изложенных в книге, инструментов. Предисловие.
CSS3 сегодня.
Не читайте спецификации.
CSS3 – для всех.
Целиться на взаимодействие.
Когда применять CSS вные свойства CSS3, применимые сейчас.
border-radius.
text-shadow.
box-shadow.
Несколько фоновых изображений opacity.
RGBA.
Какие темы не будут затронуты.
Префиксы конкретных браузеров.
Как работают браузерные префиксы.
Оптимальный порядок.
Не пугайтесь браузерных префиксов!
А как насчет повторений?
Переходы в CSS.
Хвост, который размахивает собакой.
Что такое CSS-переходы.
Простой пример.
Временные функции (мне следовало быть внимательнее на уроках математики).
Задержка перехода.
Краткая форма записи.
Краткая форма записи перехода с задержкой.
Поддержка в браузерах.
Полная запись перехода.
Состояния перехода.
Переход нескольких свойств.
Переход всех возможных состояний.
К каким свойствам применим переход.
Почему бы не воспользоваться JavaScript?
Используйте с умом.
Hover по-новому.
Наш пример.
Сообщения в космосе и в вебе.
Удивление и восторг.
Должны ли сайты выглядеть полностью одинаково в каждом браузере?
Навигация на Луне.
Сначала разметка.
Сдвинем элементы.
Определение цвета ссылки – RGBA 43Д. Сидерхолм. «CSS3 для веб-дизайнеров».
Запасной вариант для RGBA.
Добавим text-shadow.
Оформление состояний hover и focus.
Скругление углов: border-radius.
Добавим анимацию.
Построение взаимодействия.
Простой и гибкий hover с использованием opacity.
Прозрачность на кликабельных картинках.
Разметка.
Прозрачность и эффективность картинки.
Оформление списка opacity: хак для IE.
Добавим переход.
Вперед, к новому hover.
Преобразовывая содержимое.
Масштабирование.
Добавим стиль.
Масштабирование в hover.
Подходящая тень.
Сгладим масштабирование переходом.
Преобразовывая взаимодействие.
Поворот, кручение, сдвиг.
Добавим поворот.
Нет поворота? Паника ни к чему.
Повернутое Солнце.
Кручение (skew).
Сдвиг (translate).
Разные преобразования, помогающие поддержать рассказ.
Преобразования Луны.
Поддержка сообщения.
Разметка.
Основные стили для каждого предмета.
Общее правило.
Масштабируем большой пончик.
Перспектива: масштабирование и позиционирование.
Ускользающая космическая кошка.
Откидное кресло.
Исчезающий гном.
Безопасное упрощение.
Еще раз: используйте с умом.
Побольше «вау-вау», пожалуйста.
Множественные фоны.
Параллакс.
Старый способ: дополнительная разметка.
Новый способ: множественные фоны на CSS.
Синтаксис множественного фона.
Поддержка в браузерах.
Запасной вариант для всех браузеров.
Использование множественных фонов 91Д. Сидерхолм. «CSS3 для веб-дизайнеров».
Улучшенные формы.
Разметка для простой формы регистрации.
Стили для полей и подписей.
Больше CSS3-селекторов.
Оформление полей ввода.
Градиенты в CSS.
Настоящая кнопка на CSS.
Основные стили для кнопки.
Скругление углов.
Линейный градиент.
text-shadow.
Тень на кнопке.
А как насчет других браузеров?
Использование box-shadow для создания состояния focus.
Добавление CSS-анимаций для улучшения взаимодействия с формой.
Ключевые кадры.
Ссылки на keyframe.
Повторное использование анимации для кнопки в состоянии hover.
А как насчет остальных браузеров?
Сосредоточьтесь на взаимодействии.
Заключение.
А как насчет заказчиков и руководителей, которые не понимают этого?
Что дальше?
Дополнительные материалы и ресурсы.
Об издательстве A Book Apart.
Об авторе.