Вторая связанная таблица стилей не имеет никакого эффекта - PullRequest
Новая
       2

Вторая связанная таблица стилей не имеет никакого эффекта

2 голосов
/ 25 января 2010

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

Я связываю таблицы стилей в голове следующим образом: 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<link rel="stylesheet" href="assets/css/global.css" type="text/css" media="all" title="Global styles" charset="utf-8">
<link rel="stylesheet" href="assets/css/ie.css" type="text/css" media="all" title="IE Overrides" charset="utf-8">

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

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

/* Global CSS */
body {
    background-color: #fff;
}

/* IE CSS */
body {
    background-color: #f00 !important;
}

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

Это меня озадачило, так как это очень, очень простые вещи, которые я ранее успешно делал сотни и сотни раз.

Ответы [ 2 ]

6 голосов
/ 25 января 2010

Попробуйте удалить атрибут title из обоих тегов link. title имеет особое значение при использовании со ссылками на таблицы стилей, подробнее здесь:

Альтернативный стиль: работа с альтернативными таблицами стилей

0 голосов
/ 18 ноября 2017

В моем случае я переместил рабочие наборы правил CSS из строки PHP в источнике страницы во внешний файл CSS:

От: 

    $headCss.=
    '   <style type="text/css">
            #containBrainForHire
            {   background:url(\'/graphics/BrainForHire.png\');
                display:table;
                height:300px;
                margin:0 auto;
                width:525px;
            }
        </style>
    ';

Кому: 

    #containBrainForHire
    {   background:url(\'/graphics/BrainForHire.png\');
        display:table;
        height:300px;
        margin:0 auto;
        width:525px;
    }

НИЧЕГО в новом файле CSS работало до тех пор, пока я не исправил определение background: обратные слэши, необходимые для экранирования одинарных кавычек в строке PHP, недопустимы в файле CSS.

Исправлено содержимое CSS-файла: 

    #containBrainForHire
    {   background:url('/graphics/BrainForHire.png');
        display:table;
        height:300px;
        margin:0 auto;
        width:525px;
    }

Не было ошибок в консоли ошибок , просто ничего в новом файле CSS не влияло на отображение страницы. (Так много для полезных инструментов отладки ...)

Надеюсь, это сэкономит кому-то еще время, необходимое мне, чтобы распознать проблему.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...