Порядок в файле CSS играет роль?

Question

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

Я хочу клонировать меню сайта с жестким кодом ( редактировать удалена ссылка)

Как бы я "вставил" поля (элементы ul li ul li) в подменю, возможно ли это просто в виде списка в отображении блока? Нужен ли мне z-index для них? Или плавать? Возможно ли даже плавание в элементах списка?

В общем, я понимаю каскадную вещь, но все еще стараюсь писать css с небольшим количеством повторений. Несколько советов по сокращению было бы неплохо.

Мой основной вопрос на данный момент заключается в том, почему стиль последней записи (отмеченной) перезаписывается. Порядок в файле играет роль?

#block-system-main-menu .content {
    font-size: 17px;
    font-weight: bold;
}

#block-system-main-menu div ul li {
    width: 207px;
    margin: 4px 0px;
}

#block-system-main-menu div ul li {
    display: block;
    height: 38px;
    background: url(/sites/all/themes/schott/menuitembg.gif);
}

#block-system-main-menu div ul li .active-trail {
    display: block;
    height: 60px;
    background: url(/sites/all/themes/schott/menuitembg_p.png);
}

div ul li ul li.leaf {   /* both styles are overwritten */
    display: inline-block;
    background: url(/sites/all/themes/schott/subitem_passive.gif);
}

Answer 1

Последнее написанное правило CSS является тем, которое используется, но специфичность имеет приоритет перед каскадированием.

Статья о специфике: http://css -tricks.com / specics-on-css-специфичность /

Таким образом, #block-system-main-menu div ul li .active-trail является наиболее конкретным и перезаписывает другие правила.

Answer 2

Измените его на:

#block-system-main-menu div ul li ul li.leaf {

Я немного смущен тем, что вы спрашиваете, но в целом, если у вас есть два одинаковых правила, будут применяться более поздние. Однако если правила не идентичны, более конкретное правило будет иметь приоритет.

Редактировать: извините, я вижу, вы только что поняли это

Answer 3

Да, порядок CSS определенно играет роль. Все, что объявлено после стиля, переписывает предыдущий. Кроме того, если вы хотите перезаписать стили какого-либо типа по умолчанию, включите их после стандартных (вы пишете их в одном файле или просто создаете мета-ссылку на свою таблицу стилей).