DarkPoint™-Точка кипения твоего мозга !

Могу помочь в верстке!!!!

Funny — Mon, 04 Feb 2013 14:04:07 GMT

Форум: Уроки HTML & CSS & Javascript
Автор темы: Funny
Автор последнего сообщения: Funny
Количество ответов: 0

Важный тег DOCTYPE

Titan — Mon, 27 Aug 2012 20:47:38 GMT

[Table]Вроде бы всё верно? Ваш сайт выглядит не ровно и неправильно?

Вы написали правильный стандартный XHTML код и стандартный CSS. Вы воспользовались стандартной спецификацией для работы с DOM (Document Object Model), чтобы управлять динамическими элементами на странице. И все-таки, в браузерах, которые казалось бы сделаны с соблюдением именно этих стандартов, ваш сайт не работает. Скорей всего, ошибка кроется в неправильном заголовке DOCTYPE. Эта небольшая статья расскажет вам о заголовках DOCTYPE, которые работают, а также объяснит практическое и теоретическое значение этого, казалось бы отвлеченного от реальности, тега.

Разберёмся что же такое DOCTYPE

Согласно спецификациям HTML и XHTML тег DOCTYPE (что означает "объявление типа документа") сообщает валидатору, какую именно версию (X)HTML вы используете в своей странице. Этот тег должен всегда находиться в первой строке каждой страницы. Тег DOCTYPE - ключевой компонент web-страниц, претендующих на соответствие стандартам: без него ваш код и CSS не пройдут проверку валидатором, тег DOCTYPE также важен для правильного отображения и работы страницы в броузерах, соответствующих стандартам (Mozilla, IE5/Mac, и IE6/Win).

Code

В uCoz настройку DOCTYPE осуществляют в Панели управления => Общие настройки => Значение тега

Тег DOCTYPE, в атрибутах которого указывается полный URI (полный web-адрес), сообщает браузером, что страницу нужно вывести с соблюдением определенного стандарта или подвида этого стандарта.

Если вы будете пользоваться неполным тегом DOCTYPE, устаревшим его видом, или вообще забудете про него, браузер перейдет в "загадочный" режим и будет исходить из предположения, что вы писали код страницы с ошибками и вольно отступали от стандартов, т.е. так, как писали в конце 90-ых годов.

В этом режиме браузер попытается разобрать вашу страницу по правилам обратной совместимости и выведет на экран, например, CSS так, как его вывел бы Internet Explorer 4-ой версии, а DOM будет работать так, как он работал именно в этом браузере (IE переключается в свой старый DOM, а Mozilla и Netscape 6 переключается вообще в бог знает что).

Понятно, что для вас эти выкрутасы не желательны. Но именно это вы и получите, если будете пользоваться неполным или неправильным тегом DOCTYPE.

(Внимание: браузер Opera не играет по таким правилам; он всегда пытается отобразить страницу так, как если бы она соответствовала стандартам. Слава Опере! С другой стороны, Opera пока не полностью поддерживает стандарт W3C DOM, но работа над этим уже ведется.)

Где достать правильный DOCTYPE?

Так как теги DOCTYPE очень важны для работы Web-сайта по стандартам, и так как консорциум W3C является ведущей организацией, создающей стандарты для Web-а, следовало бы ожидать, что на сайте W3C будет представлен список всех вариантов тега DOCTYPE, и казалось бы эту информацию на сайте W3C можно найти быстро и просто в каком-то определенном разделе. Но это далеко не так.

W3.org - это не сайт со статьями как A List Apart, WebReference или Webmonkey. Он не создан в помощь web-дизайнерам, разработчикам и авторам сайтов, и он не занимается распространением новейшей информации и полезных советов. Это не его задача.

Да, иногда W3C публикует серии учебных статей, хотя большинство web-разработчиков об этом даже и не подозревают. Но в основном, сайт W3C содержит собрание предложений, проектов и рекомендаций, которые написаны инженерами для инженеров.

Я могу потратить весь день в поисках правильных тегов DOCTYPE на сайте w3.org, но не найду ни одной страницы, где они перечислены все вместе. Если же вам все-таки удастся найти какой-нибудь тег DOCTYPE (например, упоминаемый в какой-нибудь Рекомендации или Рабочем проекте), скорей всего окажется, что на вашем сайте он работать не будет.

По всему сайту W3C разбросаны теги DOCTYPE, где в атрибутах отсутствует URI, и теги DOCTYPE, содержащие в атрибутах относительный URI, связанный с документами, находящимися на том же самом сайте W3C. Если вы возьмете этот тег с сайта W3C, перенесете его на свой сайт и вставите в свои страницы, относительный URI будет указывать на несуществующие на вашем сайте документы, следовательно напрасно пропадет ваш труд и усилия браузера.

Например, на многих сайтах можно встретить в страницах следующий вариант тега DOCTYPE, который был без всяких изменений перенесен с сайта w3.org:

Code

Посмотрите на последнюю часть тега DOCTYPE ("DTD/xhtml1-strict.dtd"). Обратите внимание, что это относительная ссылка на документ, расположенный на сайте W3C. Так как целевой документ находится на сайте W3C, а не на вашем, этот URI для браузера бесполезен.

А выглядеть DOCTYPE должен вот так:

Code

Обратите внимание, что этот вариант DOCTYPE содержит в конце полный вариант URI. А так как тег указывает на правильное расположение документа, браузер знает, где этот документ надо найти в сети, и следовательно выведет вашу страницу в том стандарте, который вы упомянули в DOCTYPE.

Правильные варианты тега DOCTYPE и его стандарты

Ниже перечислены полные варианты тега DOCTYPE для различных вариаций:
Стандарт HTML 4.01 Strict (строгий), Transitional (переходный), Frameset (с фреймами)

Code

Стандарт XHTML 1.0 Strict (строгий), Transitional (переходный), Frameset (с фреймами)

Code

Стандарт XHTML 1.1 DTD

Code

[/Table]

Если привышен лимит CSS

Titan — Mon, 27 Aug 2012 20:43:37 GMT

[Table]1. Копируем весь ваш CSS в чистый блокнот и подписываем его "/style.css".

2. Заливаем этот файлик в корень сайта.

3. Теперь во всех страницах ищем строчку:[/Table]

Code

[Table]И дописываем после или перед ней, без разницы, главное чтобы она была между и [/Table]

Code

Словарь uCoz

Titan — Mon, 27 Aug 2012 20:42:11 GMT

[Table] - ссылка

target=_blank - открывает ссылку в новом окне.

name="anchor1" - имя закладки.

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

shape="rect" (circle, poly) - тип области (прямоугольник, круг, многоугольник)

coords="x1,y1,..." - координаты, количество зависит от типа области

alt="описание" - описание, подсказка

href="document.html" - ссылка

- жирный текст

- крупный текст

- обязательный тэг

- задает цвет текста всего документа

- задает цвет фона документа

- задает фоновую картинку

- задает цвет ссылки

- задает цвет активной (нажатой) ссылки

- задает цвет посещенной ссылки

- определяет ширину верхнего и нижнего полей документа для IE

- определяет ширину левого и правого полей документа для IE

- определяет ширину верхнего и нижнего полей документа для NN

- определяет ширину левого и правого полей документа для NN

- перенос строки (принудительный)

clear="all" (left, right) - завершение обтекания текстом объекта (картинки).

- центрирование текста

- сам по себе погоды не делает, всегда употребляется с одним из параметров, приведенных ниже

текст - задает цвет текста выбранной части документа.

текст - задает размер шрифта текста (от -2 до +4)

текст - задает определенный шрифт в документе (можно прописать какой-нибудь экзотический шрифт)

- определяет фрэйм и его свойства внутри frameset - главы 24 - 30.

marginheight="0" - определяет ширину верхнего и нижнего полей фрэйма.

marginwidth="0" - определяет ширину левого и правого полей фрэйма.

scrolling="yes" (no, auto) - линейка прокрутки будет всегда (никогда, если надо).

name="window-1" - имя фрейма, используется для ссылки на него из других документов (фреймов), с помощью параметра тэга target (target="имя_фрейма").

- определяет фрэймовую структуру документа. Открывает и закрывает список фрэймов - главы 24 - 30.

rows="100,200,*" - определяет количество и размеры горизонтальных фрэймов (рядов). Размеры задаются в процентах или пикселях.

cols="10%,20%,70%" - определяет количество и размеры вертикальных фрэймов (колонок).Размеры задаются в процентах или пикселах.

border - определяет ширину рамок фрэймов в пикселах.

- заголовок

- обязательный тэг

[ hr] - линия (Без пробела)

(center или left)

(ширина линии в процентах)

(толщина линии)

(отмена объемности)

(цвет линии, только в IE)

- обязательный тэг

- выделяет текст курсивом

- рисунок

Border="5" - рамка покруг картинки

width="500" - ширина картинки

height="100" - высота картинки

align="left" - расположение текста по отношению к картинке (right, top, middle, left, bottom)

vspace="10" - расстояние от картинки до текста по вертикали

hspace="30" - расстояние от картинки до текста по горизонтали

alt="описание" - описание картинки

usemap="#karta1" - ссылка на карту

- навигационные карты

name="karta1" - имя карты

- бегущая строка (текста)

height="16" - высота строки

width="250" - ширина строки

bgcolor="#99CCFF" - цвет фона

vspace="10" - расстояние от бегущей строки до текста (картинок, др. объектов) по вертикали

hspace="20" - расстояние от бегущей строки до текста (картинок, др. объектов) по горизонтали

loop="2" - сколько раз прокрутится строка

direction="left" (right, up, down) - направление движения строки - влево (вправо, вверх, вниз)

behavior="scroll" (slide, alternate) - поведение строки - обычная прокрутка (прокрутка с остановкой, от края к краю)

scrollamount="1" - скорость движения строки, может принимать значения от 1 до 10 (1 - самое медленное движение, 10 - самое быстрое)

- cписки

type="disk" - полный кружок (по умочанию)

type="circle" - полый кружок

type="square" - квадратик

- параграф

текст

- центрирование текста.

текст

- выравнивание текста по правому краю документа.

текст

- выравнивание текста по левому краю документа.

текст

- выравнивание текста по обоим краям документа.

- форматированый текст

- перечеркнутый текст

- малый текст

- перечеркнутый текст

- нижний индекс

- верхний индекс

- название документа

- таблицы

- строчка (ряд) таблицы.

- столбец (ячейка) таблицы.

bgcolor="#FFCC33" - цвет фона таблицы (строки, ячейки).

background="картинка.gif" - задает фоновый рисунок для таблицы (строки, ячейки).

width="50" или width="50%"- ширина таблицы (строки, ячейки) в пикселях или процентах.

height="45" или height="45%"- высота таблицы (строки, ячейки) в пикселях или процентах.

align="center" (right, left) - выравнивает содержимое ячейки относительно ее центра (правого или левого краев).

valign="middle" (top, bottom) - вертикальное выравнивание содержимого строки (ячейки) по середине (наверху или внизу).

colspan="2" - растянуть ячейку на несколько стобцов.

rowspan="2" - растянуть ячейку на несколько рядов.

cellspacing="5" - задает пространство между ячейками.

cellpadding="5" - задает пространство внутри ячейки между ее содержимым и границами.

border="3" - задает толщину рамки таблицы.

bordercolor="#000000" - задает цвет рамки таблицы.

- фиксированный (моноширинный) текст

- подчеркнутый текст[/Table]