Проблема DOCTYPE CSS - PullRequest
Новая
       10

Проблема DOCTYPE CSS

2 голосов
/ 18 августа 2010

Когда я добавил строку 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

в начало моего HTML-файла, мои правила CSS исчезли в Firefox.Также я не могу видеть их с клопом.

У вас есть идеи по поводу этой проблемы?

Ответы [ 3 ]

3 голосов
/ 18 августа 2010

Убедитесь, что файлы отправляются сервером с правильным типом MIME (text/css). Загляните в консоль ошибок (в английской версии IIRC меню должно быть Tools / Error Console).

Обычно, если файл оканчивается на .css, это должно происходить автоматически, однако все еще существуют плохо настроенные серверы. Если вы используете веб-сервер Apache, вы можете исправить это с помощью файла .htaccess, в противном случае вам нужно будет обратиться в службу поддержки.

Детали: https://developer.mozilla.org/en/incorrect_mime_type_for_css_files

2 голосов
/ 18 августа 2010

Вам нужно добавить атрибуты в тэг start-html, чтобы все было правильно.Это сделано, поскольку XHTML действительно является XML. 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
        <link href="style.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
    ...
    </body>
</html>

Приведенный выше код предлагает вам иметь файл style.css в корневом каталоге вашего сайта.

0 голосов
/ 01 мая 2015

Пожалуйста, проверьте это

http://www.w3schools.com/tags/tag_doctype.asp

Я думаю, у вас есть больше идей о доктайпе 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
html, body {
padding:0;
margin:0;
height:100%;
}
#wrap {
background:red;
height:100%;
overflow:hidden;
}
#right {
background:blue;
float:left;
width:30%;
height:100%;
}
#left {
background:yellow;
float:left;
width:70%;
height:100%;
}
</style>
</head>
<body>
<div id="wrap">
<div id="left"> Content </div>
<div id="right"> Side Content </div>
</div>
</body>
</html>
...