Различные стили 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, я хотел бы знать, что это такое. Есть ли уже написанная статья, в которой перечислены все стили.

Thanks

Answer 1

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

http://css-tricks.com/different-ways-to-format-css/

Answer 2

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

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

Answer 3

Мой ответ будет больше, чем вы хотите, потому что я видел CSS файлы, которые были 60K долго и состоял в основном из классов и ID, переписывающих других, потому что никто не знает, как работает 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!»