Вы используете рамки CSS?

Ответ 1

Нет, я не использую фреймворк, просто хорошо продуманную систему именования, которую я повторно использую снова и снова, и базовый CSS с несколькими сбрасываниями и некоторыми базовыми стилями.

Почему я не использую фреймворк css?

Использование фреймворка обычно предполагает, что дизайнер знаком с его соглашениями, что довольно часто бывает не так - вы не тот, кто разрабатывает страницу, или у клиента есть свой собственный дизайнер. И даже если это не так, всегда будут проекты, которые не будут вписываться в 960 пикселей или просто иметь ровный размер, поэтому вы не сможете использовать свой магический класс .span-4.

Это приводит меня к следующему пункту. Именование не является семантическим. В теории вы ожидаете, что структура упростит работу с большим сайтом. Однако предположим, что вам нужно сделать небольшое изменение дизайна. Это в основном означает изменение html во всех рассматриваемых видах шаблона. Это сложно и рискованно даже с системой управления версиями, потому что одно дело - откат к одному файлу css и еще 100 просмотров. Все, потому что input.span-19 должен иметь 5 пикселей меньше. CSS frameworks - новый встроенный css.

Как насчет проблем с кросс-браузером? Либо вы используете фреймворк, либо нет, это не изменится. Существуют браузеры или операционные системы, которые имеют определенные особенности. Итог - Internet Explorer все равно будет сосать.

CSS Frameworks выделяются дисциплиной, и я должен отдать им должное за это, но в конце концов это все о том, кто пишет код.

Ответ 2

Я заметил два основных заблуждения относительно css frameworks.

Во-первых, существует тенденция к путанице между концепцией структуры, используемой в разработке программного обеспечения, как инструмента и типа структуры, такой как 960gs.

Википедия определяет структуру как "абстракцию, в которой программное обеспечение, предоставляющее общие функции, может быть выборочно изменено кодом пользователя, таким образом предоставляя прикладное программное обеспечение".

@vise говорит: "Я не использую фреймворк, просто хорошо продуманную систему именования, которую я повторно использую снова и снова, и базовый CSS с несколькими сбрасываниями и некоторыми базовыми стилями". Это похоже на высказывание "Я не использую никаких фреймворков, а всего лишь рамки". Это, вероятно, какая-то семантическая ирония. Не предусмотрено преступление:)

Blueprint, 960, компас и т.д. - это все типы фреймворков. Поскольку некоторые фреймворки css не могут быть семантическими или лишены некоторых желательных качеств, это не означает, что рамки css - плохая идея.

Второе заблуждение состоит в том, что рамки css и css являются взаимоисключающими. Вы либо кодируете css вручную, либо используете фреймворк (с некоторыми настраиваемыми файлами). Но... подождите минуту... не CSS - набор элементов по умолчанию, которые мы можем изменить или расширить в соответствии с нашими конкретными требованиями? CSS выглядит подозрительно, как структура в соответствии с определением Википедии.

Конечно, этот второй пункт спорный. Но часто я нахожу, что люди используют какую-то структуру, не зная об этом.

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

Надеюсь, это поможет!

Ответ 3

Мне нравятся инструменты yui css. Эти ребята определенно потратили больше времени на кросс-браузер css, чем мне было бы интересно. Я не пробовал других.

Ответ 4

Я использую yahoo yui-css. Это первый, с которым я столкнулся, и это было легко понять. Я только что увидел видео и чит-лист и получил его работу. Также Yahoo использует его на некоторых своих сайтах.

Ответ 5

Я использую Blueprint вместе с Compass. Кодирование CSS стало приятным снова.: -)

Ответ 6

Компас/Sass сочетание фантастическое и предлагает несколько плагинов для использования рамки по вашему выбору без имен не семантического класса. Вне компаса я всегда считал рамки слишком строгими и использовал слишком много разметки.

Я не поклонник Blueprint, 960gs и плагинов YUI для Compass: они были изначально созданы для использования с дополнительной разметкой и не в полной мере используют Compass/Sass для дополнительной гибкости. Поэтому я построил " Susy '- гибкая структура, встроенная в Compass/Sass.

Независимо от того, какой плагин вы используете (или пишите самостоятельно), я настоятельно рекомендую Compass/Sass лучше, чем дополнительная разметка.

Ответ 7

Я создал свое собственное подмножество классов, из которого я нашел себя очень часто, это заставляет меня работать быстрее и создавать html-макеты намного проще, не повторяя одинаковых свойств под множеством классов.

Например, для встроенных divs у меня есть классы fl и fr для представления float справа и слева, для ширины жидкости у меня 20 классов ширины. Вот некоторые классы из моей общей таблицы стилей, о которой я упоминал. Это работает для меня.

.fl { display:inline; float:left;}
.fll { display:inline!important; float:left!important;}
.fr { display:inline; float:right}
.frr { display:inline!important; float:right!important;}
.ib { display: -moz-inline-block; display:inline-block;}
.clear { clear: both}
.none {display:none;}
.noni {display: none!important;}
.block {display:block;}
.blocki {display: block!important;}
.pointer {cursor: pointer !important;}
...
.w10 { width: 10% !important; }
.w15 { width: 15% !important; }
.w20 { width: 20% !important; }
.w25 { width: 25% !important; }
...

Таким образом, этот метод не может быть заменой рамки, конечно, но это работает достаточно хорошо, если вы не хотите иметь какую-либо другую вещь между вашими стилями и вами:)

Синан.

P.S. В IE6 и ниже несколько классов работают с ошибкой, что нужно использовать в современных браузерах. см. таблица в Quirksmode

Ответ 8

Я использовал Blueprint-css в некоторых местах и ​​нашел его весьма полезным.

Ответ 9

960 Grid System - это попытка упорядочить рабочий процесс веб-разработки, предоставляя широко используемые размеры на основе ширины 960 пикселей. Существует два варианта: 12 и 16 столбцов, которые могут использоваться отдельно или в тандеме.

Я предпочитаю флюидную версию 960.gs: Гибкая система Fluid 960

Ответ 10

Только что начал проект с использованием сетки 960. Дизайнер купил это на ранней стадии, и пусть он руководит его проектами.

Я должен сказать, это намного быстрее. Проводите гораздо меньше времени, измеряя пиксели на макетах, задавая дизайнеру намерение и работая с CSS для создания "шаблонов страниц". Проводите гораздо больше времени, просто реализуя проекты.

Ответ 11

Я использую несколько на регулярной основе, и я бы рекомендовал проверить их.

heymuscle - это гибкая среда css, которая подходит для 1140px/960px/ipad/iphone, аналогичной 960gs

960 grid является одной из самых популярных сетей и предоставляет простые в использовании классы для размещения вашей страницы

1140 grid - это жидкий макет

Надеюсь, что это поможет