Веб-дизайнер женщина работает на своем компьютере в современном офисе
Кредит изображения: monkeybusinessimages / iStock / Getty Images
Исходная спецификация каскадных таблиц стилей, а также более поздняя версия CSS3 - это технологии, используемые для улучшения и форматирования веб-страниц HTML. Изначально CSS был разработан для более эффективной обработки уровня представления веб-страницы, чем форматирование с помощью HTML, который никогда не предназначался для обработки сложной конструкции современной сети. Поскольку CSS2 является общепринятым расширением CSS1, термин CSS без номера подразумевает включение CSS2. По состоянию на июль 2014 года спецификация CSS3 все еще находится в стадии разработки, поэтому веб-разработчикам необходимо учитывать, что поддержка функций варьируется в зависимости от браузера.
CSS3 обратно совместим с CSS
CSS3 - это обновление CSS2, которое поддерживает совместимость со всеми функциями CSS - CSS3 не осуждает ни один код CSS. Код CSS3 предназначен для улучшения внешнего вида и ускорения загрузки веб-страниц, а также для сокращения времени разработки для создания страниц в браузере пользователя. CSS3 делает веб-дизайн менее зависимым от файлов изображений для элементов дизайна страницы и сокращает количество запросов на передачу файлов и время загрузки за счет использования меньшего количества изображений. CSS1 сфокусирован на форматировании внешнего вида, тогда как CSS2 добавил возможности позиционирования для текста и объектов. Более старые версии браузеров, такие как IE 9 и более ранние, не очень широко поддерживают добавленные функции CSS3, что может потребовать дополнительного времени на разработку для поддержки резервного кода CSS.
Видео дня
CSS3 добавляет закругленные углы и градиенты
До появления CSS3 веб-разработчикам приходилось проектировать файлы изображений, чтобы добавлять такие вещи, как закругленные углы для структурных границ и градиенты фонового изображения; CSS3 включает сопоставимые функции, которые можно добавить с помощью нескольких строк кода. В CSS веб-разработчик должен разработать границу или градиент, загрузить их на сервер изображений, разместить изображение на странице и использовать CSS для правильного позиционирования границы. В CSS3 веб-разработчик может сделать нечто подобное с помощью кода типа ".roundBorder {border-radius: 10px;}". Фоновые градиенты немного сложнее и требуют разного кода для разных браузеров. Например, градиент от белого к черному для Chrome и IE использует код типа ".gradBG {background: liner-gradient (white, black);}".
CSS3 добавляет функции анимации и текстовые эффекты
В CSS3 есть несколько функций, которых нет в CSS, чтобы улучшить внешний вид элементов страницы. С помощью CSS3 веб-разработчики могут добавить текстовую тень к тексту, чтобы его было легче читать, или добавить визуального чутья, а также могут принудительно переносить строки в более длинные слова, чтобы они помещались внутри столбцов с переносом слов. До появления CSS3 веб-разработчикам требовалось кодировать анимацию на языках сценариев, таких как JavaScript и jQuery; CSS3 добавляет несколько функций анимации на уровень дизайна. W3C все еще работает над стандартом веб-анимации, чтобы решить проблемы совместимости между различными методами анимации.
CSS3 определяет текстовые столбцы
CSS3 добавляет возможность разбивать текстовые разделы на несколько столбцов для чтения, как в газете. В спецификации CSS2 веб-разработчикам сложно создавать текстовые разделы, состоящие из нескольких столбцов, поскольку в стандарте не предусмотрено автоматическое разделение текста. В частности, с сайтами с адаптивным дизайном, техникой разработки, которая меняет порядок и размер содержимого в зависимости от при просмотре разрешения экрана устройства людям с большими мониторами может быть трудно читать текстовые строки, которые растягиваются по всему экрану. экран.
