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


Пользователь месяца
Ixman Ixman 1-й за Октябрь
Очков активности: 693 0 тем, 33 сообщения, 14 баллов репутации
Сайт: o5cat.ru
ТОП самых активных за этот месяц
  • Фотография ShowPrint
    #1

    ShowPrint (ShowPrint.ru)
    Очков активности: 96 Вне конкурса за определение пользователя месяца

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

    yuran (yurbol.ru)
    Очков активности: 82.5 0 тем, 55 сообщений, 1 балл репутации

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

    Ixman (o5cat.ru)
    Очков активности: 72 Вне конкурса за определение пользователя месяца

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

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

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

    Mandarin
    Очков активности: 42 0 тем, 28 сообщений, 1 балл репутации

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

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

  • Фотография pozitron123
    #7

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

  • Фотография алексс
    #8

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

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

    Scool (stostory.ru)
    Очков активности: 18 3 темы, 3 сообщения, 1 балл репутации

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

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

  • Показать весь ТОП 10
Поддержите форум! =)
Апдейты
  • Яндекс ИКС: 31.10.2018
  • Яндекс выдача: 15.11.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