Поиск статей: CSS

Выравнивание содержимого по горизонтали, которое имеет свойство float, можно сделать очень легко и кроме того полностью кроссбраузерно (работает в Opera 8+, Firefox 3+, IE 5.5+).

Недавно встал вопрос об оптимизации загрузки одного из моих сайтов. Помимо стандартных действий по увеличению производительности в Drupal: минимизации кода CSS и JavaScript, установки необходимых настроек на странице "Производительность", я решил уменьшить размер отдаваемых браузеру файлов и страниц сайта с помощью их сжатия.

Благодаря произведенным усовершенствованиям я добился сжатия большей части передаваемых с сайта данных. Кроме того я смог включить кэширование браузером для сжатых данных. В конце концов все эти действия позволили сжать HTML-код, JS и CSS файлы совокупно в три раза, а вес главной страницы уменьшить вдвое.

В прошлом году или около того наконец-то появился интерес к проблеме оформления текста в среде Веб, и теперь во многих статьях и на форумах обсуждают предложенные методы и теории. Часто в конце концов преобладающей становится идея о том, что хорошее оформление требует тщательного контроля размера шрифта и высоты строки. Но ведь это же Веб: среда, где читатель может иметь такой же контроль, что и дизайнер — и результатом должно быть то, что текст в Веб, хотя и по воли дизайнера, должен быть гибок в различных браузерах и ОС.

Вероятно одной из самых частых ошибок обеспечения доступности в CSS является пренебрежение псевдо-классом :focus при использовании :hover. Сколько же проблем приносит такое пренебрежение пользователям, не использующим мышь?

Каждый, кто часто использовал CSS, вероятно был расстроен отсутствием поддержки селекторов в Internet Explorer 6. Существует довольно много случаев, когда селекторы CSS 2.1 позволяют использовать правила, работающие во всех других основных браузерах, но, если вы хотите, чтобы это работало и в IE 6, вам придётся добавить класс или идентификатор в HTML-код.

Наконец-то доля IE 6 на рынке находится на том уровне, когда мы как разработчики можем сказать, что сайт, поддерживающий IE 6, не значит "выглядящий совершенно". К счастью всё больше и больше пользователей это понимают. IE 7 вышел более трёх лет назад, а IE 9 ещё на горизонте, поэтому я думаю, пришло время воскресить css-селекторы, которые вы никогда не использовали только потому, что IE 6 не мог их понять.

Свойства позиционирования CSS позволяют расположить элементы так, как вам это нужно. Вы можете расположить элемент позади другого, и указать то, что должно происходить, если содержимое элемента слишком велико.

Из всех JavaScript-библиотек, jQuery вероятно имеет синтаксис селекторов, наиболее близкий к спецификации CSS. Это делает её простой для изучения верстальщиками и веб-дизайнерам, разбирающихся в CSS. Хотя в jQuery существует более 50 селекторов, иногда необходимо находить элементы на страницы по определенным, специфическим признакам. Именно для таких целей и удобно создавать собственные селекторы jQuery.

Большинство людей используют несколько файлов для создания CSS под разные типы устройств, по принадлежности разделам сайта или предназначению содержимого соответствующих таблиц стилей (позиционирование, цвета, типографика). При этом существует два недостатка: это приводит к большему числу HTTP-запросов от браузера к серверу и необходимости поддержки в актуальном состоянии нескольких CSS файлов одновременно. О том как избежать этих проблем и пойдет речь в этой статье.

Свойство line-height может принимать числовые значения без указания единицы измерения (px, em, %). Можно задать значение в одной из допустимых единиц измерения, но лучше этого не делать. Безразмерные значения более удачны для этого свойства CSS.

Одной из частых проблем при верстке и дизайне HTML-документов является неправильное отображение страницы различными браузерами или их версиями. И по известным всем причинам браузер Internet Explorer (IE) интерпретирует правила XHTML и CSS не так, как это положено по стандартам. Условные комментарии могут быть использованы для того, чтобы избежать проблем с этим «гадким» браузером.