Заключение
Вы должны теперь хорошо понимать фоновые изображения CSS, и что еще более важно, вы стали лучше справляться с чтением спецификаций, поэтому, если возникают сомнения относительно определенного свойства, вы должны знать, как найти его описание. В данной лекции были рассмотрены фоновый цвет, изображение, повторение, присоединение, и позиционирование. Вы узнали также, почему разработчики используют спрайты CSS, и как использовать эту развитую технику.
Сведения об авторах изображений
The Tiles (http://www.flickr.com/photos/dimsumdarren/1342305614/), DimsumDarren little glass tiles (http://www.flickr.com/photos/emdot/6099842/), emdot
Контрольные вопросы
Параграф имеет размер 40px на 180px, а фоновое изображение 60px на 200px. Увидите ли вы все изображение или только его часть? Почему?
Вы хотите, чтобы изображение было позиционировано в нижнем левом углу элемента blockquote - впишите, пожалуйста, правильные значения.
blockquote{background: yellow url(quote.png) no-repeat scroll ____ ____ ;}
Предположим, что вы хотите, чтобы каждый заголовок h2 в документе с классом "question" использовал шаблон градиента. Будете ли вы использовать repeat-x, repeat-y, no-repeat, или repeat, чтобы получить что-то похожее на пример ниже? Почему?
Какой будет позиция фонового изображения в примере вопроса 3? Как можно было бы творчески использовать фоновый цвет, чтобы гарантировать, что фон может растягиваться на любую высоту? Почему это важно?
Какое сокращение можно использовать для удаления всех свойств фона?
Для чего нужны спрайты CSS?
Дополнительное чтение
Производительность и запросы HTTP на YDN (http://developer.yahoo.com/performance/rules.html#num_http)
Спецификация CSS2- Цвет и фон (http://www.w3.org/TR/REC-CSS2/colors.html)
Спрайты CSS (http://www.alistapart.com/articles/sprites)
Надежный Web-дизайн (http://www.simplebits.com/publications/bulletproof/) - Моя любимая книга
Об авторе
Николь Сулливан живет в Калифорнии и является специалистом по производительности CSS. Она начала свою личную карьеру в 2000 г., когда ее будущий муж (тогда сотрудник W3C) сказал ей, что если ее Web-сайт не пройдет валидацию, он не сможет ночью уснуть. Она решила, что будет все-таки лучше узнать, что это такое за штука "валидатор", и так родилась любовь к стандартам.
По мере того как росло ее понимание производительности и крупномасштабных сайтов, она перешла на работу в бизнес онлайн-маркетинга, создания инфраструктурных решений для многих хорошо известных европейских и мировых брендов, таких как SFR, Club Med, SNCF, La Poste, FNAC, Accor Hotels, и Renault.
Николь работает сейчас в Yahoo! в группе Exceptional Performance. Ее роль состоит в исследовании и распространении лучших методов повышения производительности и создания таких инструментов как Yslow, которые помогают другим F2E создавать более совершенные сайты. Она пишет о стандартах, своей собаке, и своих навязчивых мыслях в отношении объектно-ориентированного CSS на сайте www.stubbornella.org.