 |
АвтоАвтоматизацияАрхитектураАстрономияАудитБиологияБухгалтерияВоенное делоГенетикаГеографияГеологияГосударствоДомДругоеЖурналистика и СМИИзобретательствоИностранные языкиИнформатикаИскусствоИсторияКомпьютерыКулинарияКультураЛексикологияЛитератураЛогикаМаркетингМатематикаМашиностроениеМедицинаМенеджментМеталлы и СваркаМеханикаМузыкаНаселениеОбразованиеОхрана безопасности жизниОхрана ТрудаПедагогикаПолитикаПравоПриборостроениеПрограммированиеПроизводствоПромышленностьПсихологияРадиоРегилияСвязьСоциологияСпортСтандартизацияСтроительствоТехнологииТорговляТуризмФизикаФизиологияФилософияФинансыХимияХозяйствоЦеннообразованиеЧерчениеЭкологияЭконометрикаЭкономикаЭлектроникаЮриспунденкция
Язык разметки гипертекста HTML (hypertext markup language)
|
Читайте также: |
Лабораторная работа № 3
Создание Web - страниц
Язык разметки гипертекста HTML (hypertext markup language)
Для paбoты c HTML-кoдoм нaпpямyю пользуемся редактором Notepad (Блокнот)
1. Откройте Блокнот и наберите в текст:
| Примечание: Все, что выделено курсивом, исправляете. Обозреватель игнорирует комментарии. |
| <!--Пример HTML документа.--> <html> <head> <!--Следующая строчка - кодировка.--> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <title> Ваш заголовок </title> </head> <body> <!--Теперь указываем название шрифта (лучше два, можна и больше, через запятую), его размер и цвет.--> <font face="Verdana,Sans-serif" size="2" color="#000000"> <b> Название Вашего раздела </b><p> Здесь Ваш текст. <p> <!--Далее встраиваем графический файл в документ. И будет он у нас по центру.--> <center> <img border=0 src=" Имя графического файла с расширением " Width=" Его размер по горизонтали " Height=" Его размер по вертикали " alt=" Здесь Вы указываете выпадающую подсказку "> </center> </font> </body> </html> |
Сохраните документ как htm файл (например, 001.htm) и запустите.
Теги - знаки, располагающихся в скобках. Большинство тегов имеют открывающий элемент <> и закрывающий </>. Между ними и находятся коды, которые распознает Обозреватель. HTML-документ всегда начинаться отрывающимся тегом <HTML> и заканчиваться закрывающим </HTML>. Дальше идет заголовок <HEAD></HEAD>. Между этими тегами всегда должна находиться информация о кодировки страницы, в нашем случае <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">, и теги, определяющие название страницы <TITLE></TITLE>. Только теперь между тегами содержимого документа <BODY></BODY> можно располагать свою информацию, рисунки, видеофайлы, аудиофайлы и т.д.
Размеры графического файла (в пикселях) по горизонтали и по вертикали, а также выпадающую подсказку можно не указывать, но тогда страничка грузиться дольше, не забывайте об этом. И еще - большие картинки Обозреватель может игнорировать, если Вы не укажите их размеры.
Большинство HTML документов имеют заголовок. Для его создания используют теги <Hn></Hn>, где n – число от 1 до 6. Заключив текст между этими тегами, вы получите заголовок определенного размера.
<H1>Заголовок</H1>
<H2>Заголовок</H2>
<H3>Заголовок</H3>
<H4>Заголовок</H4>
<H5>Заголовок</H5>
<H6>Заголовок</H6>
Для создания нового абзаца используется тег <P>, а для перехода на новую строчку без создания абзаца - тег <BR>. Эти теги закрывать не обязательно. Конечно, если Вы не используете в теге <P> элемент ALIGN, которым может задаваться выравнивание абзаца:
<P ALIGN=LEFT> По левому краю </P>
<P ALIGN=CENTER> По центру </P>
<P ALIGN=RIGHT> По правому краю </P>
<P ALIGN=JUSTIFY> Текст, находящийся между этими элементами выравнивается по ширине </P>
Текст
Для придания тексту определенного начертания - жирный, курсив, подчеркнутый и т.д., поместите его между соответствующими тегами:
| <B>Жирный текст</B> |
| <I> Курсив </I> |
| <U> Подчеркнутый </U> |
| <STRIKE> |
| <SUP> Верхний индекс </SUP> |
| <SUB> Нижний индекс </SUB> |
Некоторые теги могут или должны применяться с определенными параметрами, которые указываются в открывающемся элементе тега (можно сразу указывать несколько параметров в одном теге). Например, открывающийся тег <FONT> (закрывающийся тег </FONT> обязателен) может иметь несколько атрибутов:
SIZE - задает размер текста (по умолчанию размер текста равен 3). Поместив текст между тегами <FONT SIZE=n></FONT>, где n - цифровое значение, вы придадите ему нужный вам размер:
<font size="1"> Пример 1 </font>
<font size="2"> Пример 2 </font>
<font size="3"> Пример 3 </font>
<font size="4"> Пример 4 </font>
<font size="5"> Пример 5 </font>
<font size="6"> Пример 6 </font>
FACE - задает стандартное имя шрифта. Используйте шрифты, которые установлены на компьютере пользователя, в противном случае Обозреватель будет использовать шрифт, определенный по умолчанию (обычно Times New Roman). К стандартным шрифтам можно отнести шрифты, поставляемые с Windows 98, Ms Plus, Ms Office. В самой нижней строке данной таблицы представлено использование семества шрифта - имя каждого шрифта пишется через запятую. Если у пользователя на компьютере нет шрифта Comic Sans MS, Обозреватель подставит следующий в этом списке - Tahoma.
| <font face="Times New Roman"> Times New Roman </font> |
| <font face="System"> System </font> |
| <font face="Arial"> Arial </font> |
| <font face="Courier"> Courier </font> |
| <font face="Verdana"> Verdana </font> |
| <font face="Comic Sans MS, Tahoma"> Comic Sans MS </font> |
COLOR - задает цвет текста (по умолчанию черный - #000000). Цвет текста может определятся как самим названием, например, red, blue и т.д, так и представлен в шестнадцатеричном виде - #FF0000 (красный) #0000FF (синий).
<font COLOR="red"> Красный </font>
<font COLOR="#FF0000"> Красный </font>
С помощью элемента STYLE тега <SPAN> (закрывающийся тег </SPAN> обязателен) можно задавать выделение текста любым цветом:
<SPAN STYLE="BACKGROUND-COLOR: lightgreen"> Светлозеленый </SPAN>
<SPAN STYLE="BACKGROUND-COLOR: yellow"> Желтый </SPAN>
<SPAN STYLE="BACKGROUND-COLOR: lightblue"> Светлосиний </SPAN>
Поиск по сайту: