[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Что такое HTML
Ling Дата: Понедельник, 29.11.2010, 00:12 | Сообщение 1
Что такое HTML

Всемирная паутина соткана из Web-страниц (Web-pages), а эти страницы создаются при помощи языка разметки гипертекста (HyperТext Markup Language, HTML). Хотя многие, особенно новички, говорят сегодня о "Программировании (именно с большой буквы) на HTML", HTML вовсе не является языком программирования. HTML – это язык разметки. Вы используете HTML для разметки текстового документа, точно так же, как это делает редактор при помощи жирного красного карандаша. Эти пометки служат для определения формата (или стиля), который будет использован при выводе текста на экран монитора.
Общий вид HTML-файла, теги

M в аббревиатуре HTML означает "mark-up" -- разметка. Текст размечается тегами, которые являют собой ключевые слова языка, заключенные в угловые скобки "<" и ">" (больше-меньше). Чаще их употребляют парами, чтобы отметить начало и конец некоторого куска текста. Отмечают же его для для того, чтобы броузкер показывал текст на экране в заданном тегами виде.

В приведенном после горизонтальной линейки примере три пары тегов:
<HTML> -- </HTML>
Пара, которая показывает, что содержимое файла -- документ в формате HTML.
<HEAD> -- </HEAD>
Пара обрамляющая текст, не выводимый на экран, и предназначенный для машин.
<BODY> -- </BODY>
Пара обрамляющая текст, выводимый на экран.

Закрывающий тег отличается от открывающего наличием косой черты "/".
Пример

Code
<HTML VERSION 4.0>
<HEAD>
</HEAD>
<BODY>
Так выглядит простейший HTML-файл.
</BODY>
</HTML>

Теперь откройте созданный файл с помощью веб-броузера и обратите внимание на разницу в виде исходного файла и вновь созданного.

На вид текста на экране влияют только теги, и не влияют ни пробелы, ни разбивка текста на строки.

<!DOCTYPE>

Задает версию HTML, используемую в текущем документе. Команда !DOCTYPE должна быть первой командой в документе. Команда !DOCTYPE является обязательным требованием языка HTML 3.2.

Форматирование простого текста, параграфы

Разбить текст на параграфы можно тегами <P> -- </P>. В большинстве случаев, если опустить закрывающий тег </P>, то все равно ясно, что начало следующего параграфа означает конец предыдущего, но для остальных тегов подобное неверно.

У открывающего тега <P> может быть атрибут (аргумент, параметр) ALIGN (выравнивание), который принимает значения CENTER, RIGHT или значение принятое по умолчанию (то есть когда атрибут опущен) -- LEFT. Например тег <P ALIGN=CENTER> задает параграф, строки которого центрированы. Этот атрибут могут иметь большинство парных тегов.

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

Атрибуты <BR CLEAR={LEFT | RIGHT | ALL | NONE}>

Атрибут CLEAR может быть использован, чтобы передвинуть перемещаемый образ на другой край. <BR CLEAR=LEFT> передвинет образ к левому краю, <BR CLEAR=RIGHT> - к правому краю, в то время как <BR CLEAR=ALL> сделает то же самое и к левому и к правому краям одновременно. Например, если рядом с текстом слева встречаетс рисунок, то можно использовать тег <BR> для смещения текста ниже рисунка.

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

Во избежание неприятностей с элементом <NOBR> вы можете предложить браузеру читателя альтернативное место перевода строки при помощи тега <WBR> ("мягкий" перевод строки). Эта инструкция будет выполнена только в том случае, если браузер не сможет вывести вашу фразу одной строкой в пределах окна просмотра

Для проведения горизонтальной линии используется тег <HR>

Атрибуты <HR>

Code
ALIGN Выравнивает по краю или центру; имеет значения LEFT, CENTER,RIGHT.
WIDTH Устанавливает длину линии в пикселах или процентах от ширины окна браузера; в последнем случае добавляется символ % и значение обязательноа заключается в кавычки
SIZE Устанавливает ширину линии в пикселах.
NOSHADE Отменяет рельефность линии.
COLOR Указывает цвет линии. Используется формат RGB или стандартное имя.

Обратите внимание на различие между парными тегами <P> -- </P>, которые обрамляют начало и конец куска текста, и непарным тегом <BR>, который отмечает место вставки некоторого элемента.

Вот вам пример, использующий еще и теги заголовков <H1> -- </H1> (самый крупный), <H3> -- </H3> и самый маленький <H6> -- </H6> . Здесь закрывающий тег необходим.

Code
<H1 ALIGN=CENTER> Весенняя гроза</H1>
<H3 ALIGN=CENTER>Федор Тютчев</H3>
<P ALIGN=LEFT>
Люблю грозу в начале мая,<BR>
Когда весенний, первый гром,<BR>
Как бы резвятся и играя,<BR>
Грохочет в небе голубом.
<P ALIGN=CENTER>
Гремят раскаты молодые,<BR>
Вот дождик брызнул, пыль летит,<BR>
Повисли перлы дождевые,<BR>
И солнце нити золотит.
<P ALIGN=RIGHT>
С горы бежит поток проворный,<BR>
В лесу не молкнет птичий гам,<BR>
И гам лесной, и шум нагорный --<BR>
Все вторит весело громам.
<P>
Ты скажешь: ветреная Геба,<BR>
Кормя Зевесова орла,<BR>
Громокипящий кубок с неба<BR>
Смеясь, на землю пролила.
<H6 ALIGN=RIGHT> 1828,1854</H6>

Парные теги влияют на вид следующего за ними текста, непарные влияют только на место вставки. Закрывающему тегу атрибуты не нужны.

Выделение текста и шрифты

Не стоит задавать шрифты их названиями. Нет никакой гарантии, что нужный шрифт есть у читателя. Лучше задать его стандартными тегами: хоть результат и зависит от средства просмотра и его настроек, зато наверняка текст будет изображен во-первых похоже, а во-вторых в едином стиле. Вот эти теги:
Примеры

Code
<В> Выделяет текст полужирным шрифтом.
<I> Выделяет текст курсивом.
<TT> Выводит текст шрифтом фиксированной ширины.
<U> Элемент подчёркивания.
<STRIKE> Элемент зачеркивания. Отображается текст, перечеркнутый горизонтальной линией.
<BIG> Выводит текст шрифтом большего размера.
<SMALL>  Выводит текст шрифтом меньшего размера.
<SUB> Сдвигает текст ниже уровня строки и выводит его шрифтом меньшего размера.
<SUP> Сдвигает текст выше уровня строки и выводит его шрифтом меньшего размера.
<CENTER> Центрирует блок текста, отменяет действие <P>

Тег <OL>

Нумерованные списки. Тег <OL> вместе с атрибутом ТYРЕ= в HTML 3.0 позволяет создать нумерованные списки, используя в качестве номеров не только обычные числа, но и строчные и прописные буквы, а также строчные и прописные римские цифры. При необходимости можно даже смешивать эти типы нумерации в одном списке.

<ОL ТYРЕ=1> Тег создает список с нумерацией в формате 1., 2., 3., 4. и т. д.
<ОL ТYРЕ=A> Тег создает список с нумерацией в формате А., В., С., В. и т. д.
<ОL ТYРЕ=a> Тег создает список с нумерацией в формате а., b., с., d. и т. д.
<ОL ТYРЕ=I> Тег создает список с нумерацией в формате I., II., III., IV. и т. д.



Хочу стать Отличным Web-дизайнером
Статус: Ling
  • Страница 1 из 1
  • 1
Поиск: