Перейти к содержимому


Пользователь месяца
Андрей WPMasterKZ Андрей WPMasterKZ 1-й за Ноябрь
Очков активности: 888 1 тема, 71 сообщение, 8 баллов репутации
Сайт: wpmaster.kz
ТОП самых активных за этот месяц
  • Фотография OlgaGetman
    #1

    OlgaGetman
    Очков активности: 328.5 4 темы, 61 сообщение, 3 балла репутации

  • Фотография Mandarin
    #2

    Mandarin
    Очков активности: 195 3 темы, 56 сообщений, 2 балла репутации

  • Фотография TimurR
    #3

    TimurR
    Очков активности: 45 Вне конкурса за определение пользователя месяца

  • Фотография BLIK
    #4

    BLIK
    Очков активности: 39 0 тем, 13 сообщений, 2 балла репутации

  • Фотография Rodiola
    #5

    Rodiola
    Очков активности: 36 1 тема, 9 сообщений, 2 балла репутации

  • Фотография thisismyname
    #6

    thisismyname
    Очков активности: 27 4 темы, 6 сообщений, 1 балл репутации

  • Фотография Андрей WPMasterKZ
    #7

    Андрей WPMasterKZ (wpmaster.kz)
    Очков активности: 22.5 Вне конкурса за определение пользователя месяца

  • Фотография m3Re
    #8

    m3Re
    Очков активности: 22.5 2 темы, 9 сообщений, 1 балл репутации

  • Фотография DannyaRI1
    #9

    DannyaRI1
    Очков активности: 16.5 1 тема, 8 сообщений, 1 балл репутации

  • Фотография WGN
    #10

    WGN (worldgamenews.com)
    Очков активности: 15 Вне конкурса за определение пользователя месяца

  • Показать весь ТОП 10
Поддержите форум! =)
Апдейты
  • Яндекс ИКС: 29.11.2018
  • Яндекс выдача: 09.12.2018
Топ 5 участников по репутации


Как подключить таблицу стилей в HTML 5

#1 Agasfer

Agasfer
  • Неактивные
  • 14 сообщений
  • Репутация: 1
0

Отправлено 20 August 2012 - 15:38

Плиз, подскажите как в HTML5 подключается внешняя таблица стилей?
Есть следующий код:

<!doctype html>
<html>
<head>
<title>Заголовок</title>
<link rel="stylesheet" href="menu/css.css">
</head>
<body>
<div class=header>проверка валидности</div>
</body>
</html>

Файл css.css выглядит как:

/*новые стили*/
.header {
	background: none repeat scroll 0 0 #434141;
	width: 1000px; height: 93px;
	margin: 0 auto;
}


В IE8 всё работает корректно, в Мозиле и Хроме стили не работают.
Если убрать строку "<!doctype html>" всё работает как надо, но мне-то надо html5.
В чём может быть проблема?

 

 

  • 0

#2 surfer

surfer
  • Заблокированные
  • 1956 сообщений
  • Репутация: 71

Отправлено 20 August 2012 - 15:43

так же как и в других стандартах <link rel="stylesheet" href="lion.css">
проверь путь
  • 0

#3 Agasfer

Agasfer
    Topic Starter
  • Неактивные
  • 14 сообщений
  • Репутация: 1

Отправлено 20 August 2012 - 16:00

Путь соответствует.
Если убрать строку "<!doctype html>" всё работает.
Вот живой пример на сайте: http://test.injournal.ru/test1.html


  • 0

#4 surfer

surfer
  • Заблокированные
  • 1956 сообщений
  • Репутация: 71

Отправлено 20 August 2012 - 16:21

Семен Семеныч, не рано перешли на html5 вы знаете, что не все браузеры поддерживают его, например IE8 и ниже нет,
для этого надо в <head> перед подключением таблицы стилей необходимо сделать следующее, вставить код:
		<!--[if lt IE 9]>
		<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
		<![endif]-->

http://htmlbook.ru/s...tml5/novye-tegi

а новым тегам присвоить свойство display:block;

а что должно получиться, я и в других браузерах ничего не увидел, что это? background: none repeat scroll 00#434141;
не пойму зачем этому коду необходим html5 тут нет ничего из него, кроме doctype он то и топит тебя
  • 0

#5 Agasfer

Agasfer
    Topic Starter
  • Неактивные
  • 14 сообщений
  • Репутация: 1

Отправлено 20 August 2012 - 16:31

Я полагал Хром последней версии его поддерживает. И мозила тоже.

Вот как корректно работают стили http://test.injournal.ru/test2.html .

Файл идентичен http://test.injournal.ru/test1.html за исключением первой строчки с объявлением html5.

Вопрос: почему? Исследуемые браузеры Хром и Фаерфокс, ИЕ8 я привёл всего лишь в качестве примера корректного отображения.

а новым тегам присвоить свойство display:block;


div блоковый по умолчанию, я уже упростил до безумия, не в том дело. :)

Прикрепленные изображения

  • test.jpg

  • 0

#6 surfer

surfer
  • Заблокированные
  • 1956 сообщений
  • Репутация: 71

Отправлено 20 August 2012 - 16:44

что ты хочешь, я тебе написал как решить проблему?
  • 0

#7 matroskin8

matroskin8
  • Пользователь PRO
  • 767 сообщений
  • Репутация: 143

Отправлено 20 August 2012 - 16:46

Agasfer, Вас в коде документа не смущает этот момент?:
<!doctype html>
<html>
...
Мне кажется, что один тег HTML - лишний.
  • 0


#8 Agasfer

Agasfer
    Topic Starter
  • Неактивные
  • 14 сообщений
  • Репутация: 1

Отправлено 20 August 2012 - 17:01

Нет, нифига не работает :)
http://test.injournal.ru/test1.html

<!doctype html>
<html>
<head>
<title>Заголовок</title>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link rel="stylesheet" href="menu/css.css">
</head>
<body>
<div class="header">проверка валидности</div>
</body>
</html>




Agasfer, Вас в коде документа не смущает этот момент?:

...
Мне кажется, что один тег HTML - лишний.


первый тег объявляет html 5, второй открывает тело документа

http://htmlbook.ru/s.../struktura-koda
  • 0

#9 surfer

surfer
  • Заблокированные
  • 1956 сообщений
  • Репутация: 71

Отправлено 20 August 2012 - 17:40

убери /*новые стили*/ и поставь <!DOCTYPE html> вместо <!doctype html>, ну и кодировка не помешает

вот смотри я сделал:
Прикрепленный файл  Desktop1.zip   800байт   Количество загрузок: 136Прикрепленный файл  Desktop2.zip   804байт   Количество загрузок: 130

все работает
первый как у тебя, второй чистый html5
  • 0

#10 Agasfer

Agasfer
    Topic Starter
  • Неактивные
  • 14 сообщений
  • Репутация: 1

Отправлено 20 August 2012 - 19:28

Спасибо, вложение помогло.
Когда один и тот же код в архиве работал, а на сервере нет - стал в настройках разбираться.
Проблему вызывало, что расширение .css было прописано в AddType application/x-httpd-php в .htaccess
У меня изначально таблица стилей через php генерировалась. и он, соответственно Content-typy: text/html для таблицы стилей отдавал. В старом html всё работало, в пятом перестало.

вылечилось добавлением php-кода и заголовка text/css в таблицу стилей.

<!--?php
header('Content-Type: text/css');
print'
.header {
	background: none repeat scroll 0 0 #434141;
	width: 1000px; height: 93px;
	margin: 0 auto;
}';
?-->

  • 0

#11 surfer

surfer
  • Заблокированные
  • 1956 сообщений
  • Репутация: 71

Отправлено 20 August 2012 - 19:56

спасибо не пишется, а нажимается :)
дурной тон делать файл стилей css.css замени хотябы на style.css
  • 2

#12 Agasfer

Agasfer
    Topic Starter
  • Неактивные
  • 14 сообщений
  • Репутация: 1

Отправлено 20 August 2012 - 20:15

это был тестовый файл, основная таблица стилей иначе называется.
нажал.
  • 0

#13 Kukus

Kukus
  • Неактивные
  • 134 сообщений
  • Репутация: 8

Отправлено 21 August 2012 - 07:46

спасибо не пишется, а нажимается :)
дурной тон делать файл стилей css.css


дурной тон делать файл стилей css.css и пить коньяк "Коньяк"
  • 0

#14 surfer

surfer
  • Заблокированные
  • 1956 сообщений
  • Репутация: 71

Отправлено 21 August 2012 - 07:50

и закакусывать закуской "закуска" :)
даже если это тестовое решение, а то войдет в привычку
  • 0

#15 WebMaster

WebMaster
  • Неактивные
  • 97 сообщений
  • Репутация: 3

Отправлено 22 August 2012 - 13:32

Agasfer, А ты не пробовал прописать вот так:

<link rel="stylesheet" type="text/css" href="menu/css.css" />
HTML5 не требует написания атрибута type="text/css", но и против него ни чего не имеет. Код валиден. Возможно при таком написании будут отправляться правильные заголовки.
  • 0

#16 Agasfer

Agasfer
    Topic Starter
  • Неактивные
  • 14 сообщений
  • Репутация: 1

Отправлено 22 August 2012 - 15:26

пробовал. изначально так и стояло. не отправляются.


  • 0

robot

robot
  • Пользователь PRO
  • 2652 сообщений
  • Репутация: 85


Похожие темы

  Название темы Автор Статистика Последнее сообщение

Оформление форума – IPBSkins.ru