Разные стили CSS

Question

/* Style 1 */
.myclass {
 background:#ff0;
 border:1px solid #ff0
}
#myid {
 width:80px;
 height:80px;
}

/* Style 2 */
.myclass     { background:#ff0; border:1px solid #ff0 }
#myid        { width:80px; height:80px; }

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

Спасибо

Answer 1

Вот хороший список и обсуждение:

http://css -tricks.com / разный-путь-к-формат-CSS /

Answer 2

Мой ответ будет больше, чем вы хотите, потому что я видел файлы CSS длиной 60 КБ, состоящие в основном из классов и идентификаторов, перезаписывающих другие - потому что никто не знает, как работает CSS. Они просто продолжают добавлять вещи, пока не получат желаемый результат.

.myClass { /* 0,0,1,0 */
  top-margin: 1px;
  padding: 3px;
}

#myid { /* 0,1,0,0 */
 width: 80px;
 height: 80px;
}

Повторите с пробелом между ними.

Теперь важные вещи.

1. Комментарии являются спецификой селектора.
2. Вещи должны быть упорядочены от наименее специфичных к наиболее специфичным в файле.
3. В пределах соответствия спецификация должна быть в алфавитном порядке.
4. Должно быть не более одного селектора на определение - даже если бы вы могли поставить все они в одном селекторе. Таким образом, вы можете найти их позже. И ваша специфика не запутался. Надеюсь, вы используете компрессор, который может справиться с этим правильно.
5. Классы и идентификаторы должны быть специально названы, чтобы несколько совпадать с ваша система. Другими словами, классы на www.example.com можно назвать
   .table. Если вам нужен новый класс таблиц на www.example.com/foo / ... он должен быть именуется что-то вроде .foo-table и должно применяться и использоваться вещами
   под ним.
6. Все CSS должны быть в отдельных файлах из вашего HTML-документа и все изменения в css желательно делать, меняя / добавляя классы, а не изменяя атрибуты стиля на уровне элемента.

Я единственный, кого я знаю, который делает это таким образом, но каждый, кто использовал его с тех пор, сказал: «Черт, это облегчает поиск моих ошибок CSS!»

Answer 3

Хорошо. Я не знаю, есть ли какая-нибудь статья, обсуждающая об этом. Но для меня стиль 1 лучше с точки зрения читабельности и отладки.

только мои 2 цента