Используйте несколько таблиц стилей CSS на одной странице html.

Ответ 1

Таблицы стилей эффективно объединены в одну таблицу стилей в том порядке, в котором они отображаются в источнике HTML.

нормальные правила применения наборов правил затем применяются (т.е. specificity с последним набором правил, который определяет данное свойство, выигрывая в случае галстука и ! important, бросая гаечный ключ в работы)

Ответ 2

Да, вы можете включить несколько таблиц стилей, но вам нужно пометить их как альтернативные таблицы стилей и дать пользователю возможность активировать их с помощью JavaScript - возможно, нажав ссылку.

Чтобы создать альтернативную таблицу стилей:

<link type="text/css" href="nameOfAlterateStyleSheet.css" rel="alternate stylesheet" title="Blue" />

Затем создайте метод в вашем файле Javascript, который будет: 1. Загружать все таблицы стилей в массив 2. Пример:

function getCSSArray()
{
var links = document.getElementsByTagName("link");
var link;
for(var i = 0; i < links.length; i++)
{
    link = links[i];
    if(/stylesheet/.test(link.rel))
    {
        sheets.push(link);
    }
}

    return sheets;
}

Затем перейдите через массив, используя какой-либо тип цикла if/else, который отключает таблицы стилей, которые вы не хотите, и позволяет использовать таблицу стилей. (Вы можете написать отдельный метод или вставить цикл в метод выше. Мне нравится использовать команду onload для загрузки массива CSS со страницей, а затем вызвать метод printView.)

function printView()
{
var sheet;
var title1 = "printVersion";
for(i = 0; i < sheets.length; i++)
{
    sheet = sheets[i];
            if(sheet.title == title1)
    {
        sheet.disabled = false;
    }
    else
    {
        sheet.disabled = true;
    }

Наконец, создайте код в своем HTML-документе, чтобы пользователь активировал метод JavaScript, например:

 <a href="#" onClick ="methodName();">Link Name</a>

Ответ 3

Вы не можете контролировать, что вы ссылаетесь, учитывая тот же уровень specificity в правиле (например, оба просто .banner) победа будет включена в таблицу стилей.

Это per-property, поэтому, если есть комбинация (например, у одного есть background, у другого есть color), тогда вы получите комбинацию... если свойство определено как в том, так и в другом это последний раз, когда он появляется в победе в таблице стилей.

Ответ 4

Вы не можете и не делаете.

Все правила CSS на странице будут применены (HTML "ничего не знает об этом процессе" ), и индивидуальные правила с наивысшей спецификой будут "придерживаться". Специфика определяется селектором и порядком, который они отображаются в документе. В общем, дело в том, что это часть каскадирования. Вы должны обратиться к одному из очень многих уроков CSS в сети.

Ответ 5

Вы никогда не ссылаетесь на конкретную таблицу стилей. Все правила CSS в документе внутренне слиты в один.

В случае правил в обеих таблицах стилей, которые относятся к одному и тому же элементу с той же специфичностью, таблица стилей, встроенная позже, переопределит предыдущую.

Вы можете использовать инспектор элементов, например Firebug, чтобы узнать, какие правила применяются, а какие - переопределены другими.

Ответ 6

Тот, который вы включаете последним, будет тем, который используется. Обратите внимание, что если какие-либо правила имеют важное значение в первой таблице стилей, они будут иметь приоритет.

Ответ 7

Подумайте об этом как о своих таблицах стилей, ссылающихся на ( "выбор" ) элементов на вашей HTML-странице, а не наоборот.

Ответ 8

Вы не можете. Последняя таблица стилей, которую вы укажете, будет использовать одна страница html. Подумайте об этом как о большом документе .css.