Хорошо ли когда-нибудь отдавать предпочтение классам перед продвинутыми селекторами CSS для лучшего понимания?

Question

Например, мой код такой. У меня есть только 2 пунктов под #contacts div.

#contacts {list-style:none; overflow:hidden; margin-left:7px; margin-bottom:10px}
.address { float:left}
.tel { float:right}

Я также могу сделать то же самое с этим

#contacts {list-style:none; overflow:hidden; margin-left:7px; margin-bottom:10px}
#contacts span:first-child { float:left}
#contacts span:last-child { float:left}

Answer 1

Скорее используйте

#contacts .address {...}
#contacts .tel {...}

или даже лучше, если вам нужно отпустить оба

#contacts .address, #contacts .tel {float:left;}

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

Answer 2

Псевдоэлементы :first-child и :last-child имеют смысл, если дети не передают конкретную информацию. Если дочерние элементы (как в этом случае) действительно передают конкретные детали, то классы (или, что еще лучше, атрибуты микроданных HTML5 ) являются более подходящими.