CSS переопределяет CSS и jQuery UI

#html #css #jquery-ui

#HTML #css #jquery-пользовательский интерфейс

Вопрос:

Итак, у меня есть обычный веб-сайт на CSS / HTML для моей будущей книги. В нем есть раздел под названием «Бонусные функции» для дополнительных статей, которые я написал. Они появляются с использованием jQuery UI, который считывает данные с внешних HTML-страниц.

Потому что я хочу названия и даты … т.е.

Привет, мир

6 мая 2011

… чтобы быть очень близко друг к другу, вместо вашего обычного разрыва, я создал отдельную таблицу стилей CSS (dialog.css).

 body {
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: 12px;
}

h1 {
    font-weight: bold;
    margin: 0;
}

h1   p {
    margin: 0;
}

h2 {
    margin: 0;
}

h2   p {
    margin: 0;
}

p {
    font-size: 14px;
    line-height: 18px;
    margin-bottom: 10px;
    margin-top: 0px;
}

К сожалению, dialog.css, похоже, переопределяет default.css (для веб-сайта), потому что всякий раз, когда я открываю, а затем закрываю всплывающее окно, текст на странице бонусных функций загромождается, считываясь из dialog.css, до обновления браузера.

Есть ли способ предотвратить это, например, специальный HTML или CSS-код?

Спасибо.

Ответ №1:

Похоже, что dialog.css загружается в область видимости главной страницы.

если ваш диалог построен следующим образом:

 <div id="dialog">
    <!-- content -->
</div>

затем вы можете создать свой css следующим образом:

 #dialog h1 {
    font-weight: bold;
    margin: 0;
}

и эти свойства будут применяться только к элементам внутри элемента id #dialog

1. Спасибо. Куда мне все же поместить идентификатор div? Шаблон? Если да, то где? Извините, я новичок.

2. @Ricky: Это зависит от того, как создается всплывающее окно. Я не знаком с jQuery UI, поэтому я не знаю, как действовать дальше.

3. Я понял это. Спасибо за всю вашу помощь! (:

Ответ №2:

Иногда это может быть так же просто, как следить за порядком загрузки css. Как правило, приоритет будет иметь последний по порядку. Да, бывают исключения, но, как правило, размещайте наиболее настроенный файл CSS в конце серии объявлений CSS, при этом сначала загружайте такие вещи, как css jQuery UI.

Ответ №3:

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

также вы можете попробовать добавлять !important после каждого правила.