- Фантастика и фэнтези
- Ироническое фэнтези
- Стимпанк
- Детективная фантастика
- Киберпанк
- Попаданцы
- LitRPG
- Космоопера
- Технофэнтези
- Городская фантастика
- Русское фэнтези
- Юмористическая фантастика
- Космическая фантастика
- Боевое фэнтези
- Эпическая фантастика
- Зарубежная фантастика
- Книги магов
- Мистика
- Разная фантастика
- Разное фэнтези
- Любовное фэнтези
- Романтическая фантастика
- Городское фентези
- Историческая фантастика
- Историческое фэнтези
- Социально-философская фантастика
- Сказочная фантастика
- Иностранное фэнтези
- Романтическое фэнтези
- Ироническая фантастика
- Ужасы и Мистика
- Постапокалипсис
- Героическая фантастика
- Фэнтези
- Научная Фантастика
- Социально-психологическая
- Альтернативная история
- Боевая фантастика
- Разная литература
- Пословицы, поговорки
- Шахматы
- Визуальные искусства
- Фанфик
- Авто и ПДД
- Военное
- Отраслевые издания
- Гиды, путеводители
- Зарубежная образовательная литература
- Военная история
- Цитаты из афоризмов
- Современная литература
- Великолепные истории
- Начинающие авторы
- Современная зарубежная литература
- Боевые искусства
- Изобразительное искусство, фотография
- Кино
- Литература 19 века
- Недвижимость
- Музыка, музыканты
- Готические новеллы
- Истории из жизни
- Культура и искусство
- Спецслужбы
- Зарубежная прикладная литература
- Музыка, танцы
- Подростковая литература
- Прочее
- Военная техника, оружие
- Газеты и журналы
- Периодические издания
- Домоводство, Дом и семья
- Любовные романы
- Экономическая литература
- Научные и научно-популярные книги
- О животных
- Биохимия
- Культурология
- Юриспруденция
- Политика
- Психотерапия
- Языкознание
- Научпоп
- Медицина
- Психология, личное
- Радиотехника
- Филология
- Педагогика
- Образовательная литература
- Деловая литература
- Физика
- Науки: разное
- Химия
- Воспитание детей, педагогика
- Детская психология
- Зарубежная публицистика
- Биология
- Архитектура
- Зарубежная психология
- Науки о космосе
- Социология
- Математика
- География
- Беременность, ожидание детей
- Литературоведение
- Транспорт, военная техника
- Обществознание
- Зоология
- География
- Альтернативная медицина
- Иностранные языки
- Ветеринария
- Рефераты
- Астрология
- Биофизика
- Экология
- История Европы
- Учебники
- Шпаргалки
- Государство и право
- Ботаника
- Религиоведение
- История
- Техническая литература
- Прочая научная литература
- Психология
- Детективы и Триллеры
- Справочная литература
- Проза
- Новелла
- Юмор
- Проза
- Историческая проза
- Русская современная проза
- Советская классическая проза
- Повести
- Очерки
- Эссе
- Рассказы
- Зарубежная современная проза
- Сентиментальная проза
- Зарубежная классика
- Афоризмы
- Эпистолярная проза
- Феерия
- Семейный роман/Семейная сага
- Разное
- Антисоветская литература
- Магический реализм
- Русская классическая проза
- Современная проза
- О войне
- Контркультура
- Классическая проза
- Поэзия, Драматургия
- Детская литература
- Детская фантастика
- Детские остросюжетные
- Детские стихи
- Детские приключения
- Внеклассное чтение
- Учебная литература
- Зарубежные детские книги
- Бизнес
- Загадки
- Книги для подростков
- Школьные учебники
- Детский фольклор
- Книги для дошкольников
- Детские детективы
- Детская познавательная и развивающая литература
- Буквари
- Прочая детская литература
- Сказка
- Детская проза
- Детская образовательная литература
- Юмор
- Документальные книги
- Бизнес
- Внешнеэкономическая деятельность
- Тайм-менеджмент
- Кадровый менеджмент
- О бизнесе популярно
- Управление, подбор персонала
- Бизнес
- Менеджмент и кадры
- Продажи
- Экономика
- Ценные бумаги и инвестиции
- Малый бизнес
- Делопроизводство, офис
- Корпоративная культура, бизнес
- Банковское дело
- Финансы
- Зарубежная деловая литература
- Ораторское искусство / риторика
- Личные финансы
- Интернет-бизнес
- Поиск работы
- Государственное и муниципальное управление
- Бухучет и аудит
- Работа с клиентами
- Менеджмент
- Краткое содержание
- Личная эффективность
- Переговоры
- Приключения
- Старинная литература
- Религия и духовность
- Компьютеры и Интернет
- Блог
Читаем без скачивания Работа в Интернете. Энциклопедия - Петр Ташков
Шрифт:
Интервал:
Закладка:
Таким образом, вы создали свою первую веб-страницу. Конечно, она не несет большой смысловой нагрузки и для ее создания использовался текст из рассмативаемого примера, а не писался самостоятельный HTML-код, однако создание этой странички очень важно для понимания принципов создания веб-страниц вообще. Разберемся подробнее в значении присутствующих в рассмотренном примере команд языка HTML, которые, кстати, называются HTML-тегами.
Прежде всего стоит определить расположение тегов. Дело в том, что теги в большинстве своем состоят из двух частей – открывающего (он же – содержащий параметры) и закрывающего, то есть конца тега. Закрывающий выглядит так же, как и открывающий, но начинается со знака /. Заданные в теге параметры действуют только между его началом и концом, то есть только внутри тега. В приведенном примере слово Блокноте заключено между тегами <I> и </I>. Значение этого тега становится понятным, если взглянуть на результат обработки HTML-кода браузером. Как видно на рисунке, это слово написано курсивом, из чего можно заключить, что тег <I> позволяет выделять фрагменты текста наклонным шрифтом – курсивом.
Определим значения остальных тегов, присутствующих в примере.
• <HTML> – весь HTML-код страницы заключен в этот тег (открывающий <HTML> и закрывающий </HTML>), данный тег сообщает браузеру, что обрабатываемый текст написан на языке HTML.
• <HEAD> – данный тег означает заголовок страницы, обычно в заголовке задаются разные параметры, которые не выводятся на экран в теле веб-страницы.
• <TITLE> – определяет текст, который будет выводиться в заголовке окна браузера, то есть название страницы, данный тег располагается внутри тега <HEAD>.
• После закрытия тега <HEAD> сразу же открывается тег <BODY> – в этот тег заключено тело страницы, то есть то, что пользователь будет видеть в окне браузера.
• <H1> – данный тег обозначает заголовок первого уровня, встречаются также теги <H2>, <H3> и т. д. Как видно из рисунка, заголовок отличается от остального текста.
• <P> – служит для обозначения абзаца основного текста, в такой тег заключается каждый новый абзац.
• <I> и <B> – теги для определения начертания шрифтов, которые означают соответственно курсив и полужирный шрифт.
Как видите, ничего сложного нет. Главное – уяснить, что существуют обязательные теги, которые встречаются на всех веб-страницах, а также то, что теги, как правило, парные, то есть присутствуют открывающий и закрывающий теги. Впрочем, существуют и непарные, то есть такие, где открывающий тег присутствует, а закрывающего нет. Среди таких тегов следует назвать тег <BR>, означающий перенос строки без начала нового абзаца, а также тег <HR>, который вставляет горизонтальную линию на страницу.
Сделаем еще некоторые важные замечания. Во-первых, несмотря на то, что в рассматриваемом примере все теги написаны прописными (большими) буквами, вполне допустимо их написание и строчными (маленькими) символами. Не нужно только заменять в теге латинские буквы похожими по написанию русскими. Если текст HTML-страницы в этом случае с точки зрения человека выглядит одинаково, то браузер такие неправильно написанные теги будет понимать неправильно.
Браузеру не важно положение тега, все отступы и сдвиги нужны только для того, чтобы облегчить человеку понимание и ориентирование в коде. Конечно, количество пробелов внутри кода увеличивает размер HTML-странички, поэтому злоупотреблять ими не стоит. Но если пользователь выделит какие-либо теги определенным образом, то хуже не станет. Все пробелы больше одного браузеры просто «не замечают», то есть сколько бы пробелов в тексте ни ставилось, браузер все равно отобразит его с одним пробелом.
Работа со шрифтами
Рассмотрим подробнее, как можно видоизменять отображение шрифта с помощью не только тегов <B> и <I>, но и других.
Для определения параметров шрифта, которым будет выводиться текст, служит парный тег <FONT>. Этот тег имеет дополнительные параметры, с помощью которых можно управлять внешним видом шрифта. Один из таких параметров – SIZE – задает размер шрифта. Создадим еще один файл – 2.htm и впишем в него содержимое листинга 11.2.
Листинг 11.2. Демонстрация шрифтов разных размеров<HTML>
<HEAD>
<TITLE>Шрифты разных размеров</TITLE>
</HEAD>
<BODY>
<FONT SIZE="1">текст размера 1</FONT><BR>
<FONT SIZE="2">текст размера 2</FONT><BR>
<FONT SIZE="3">текст размера 3</FONT><BR>
<FONT SIZE="4">текст размера 4</FONT><BR>
<FONT SIZE="5">текст размера 5</FONT><BR>
<FONT SIZE="6">текст размера 6</FONT><BR>
<FONT SIZE="7">текст размера 7</FONT><BR>
</BODY>
</HTML>В результате обработки этого HTML-кода браузером получим шрифты с размером от 1 до 7, показанные на рис. 11.2. Из приведенного примера также становится ясно, каким образом задаются параметры тега: после его названия пишется параметр, а затем знак =, после которого в кавычках указывается значение этого параметра.
Рис. 11.2. Пример работы параметра SIZE тега <FONT>Если нужно задать несколько параметров, то они отделяются друг от друга пробелом. Если первую строку после тега <BODY> привести к виду <FONT SIZE="1" FACE="COMIC SANS MS">текст размера 1</FONT>и то же самое сделать с остальными строками вплоть до шрифта с размером 7, то получится страница другого вида (рис. 11.3).
Рис. 11.3. Пример одновременного использования двух параметров – FACE и SIZE тега <FONT>В рассмотренном примере использовался шрифт Comic Sans MS, однако на практике при создании веб-страниц чаще всего применяются следующие шрифты: Arial, Courier New, Comic Sans MS, Times New Roman и Verdana. Эти шрифты установлены на абсолютном большинстве компьютеров, поэтому их применение гарантирует, что конечный пользователь будет видеть созданную веб-страничку в том же виде, что и ее автор.
Кроме размера и названия шрифта, можно использовать различные эффекты, которые задаются самостоятельными тегами, не относящимися к тегу <FONT>. В табл. 11.1 приведен список таких тегов.
Таблица 11.1. Теги для задания эффектов, применяемых к шрифтуНа рис. 11.4 можно увидеть, как выглядит действие перечисленных в таблице 11.1 тегов.
Рис. 11.4. Эффекты, применяемые к шрифтам, и теги, задающие ихДобавим, что можно применять несколько эффектов к одному и тому же тексту. Так, например, код <В><1>Текст</1></В> отобразит слово «Текст» наклонным полужирным шрифтом.
Гиперссылки
Гиперссылки по праву считаются основой Интернета. Вся суть Всемирной паутины заключается в присутствии ссылок на страницах различных интернет-ресурсов, благодаря чему становится возможным быстрый переход с сайта на сайт. Рассмотрим вопросы использования ссылок в веб-документах.
Как и прочие элементы оформления веб-страниц, гиперссылки создаются с помощью тегов. Тег для гиперссылки выглядит так: <A HREF="HTTP://SITE.RU">Название ссылки<М>. Разумеется, в приведенном примере адрес HTTP://SITE. RU заменяется конкретным адресом страницы, а вместо слов Название ссылки пишутся те, которые нужны в данном контексте.
Насчет конкретного адреса страницы стоит поговорить отдельно. Адрес может быть абсолютным или относительным. Чтобы подробнее объяснить, что это такое, покажем все на примере. Допустим, есть сайт, который называется http://site.ru. На этом сайте есть каталоги, один из которых носит имя, например, dir1. В этом каталоге есть некоторые файлы, один из которых называется file1.html, а другой – file2.html. Таким образом, абсолютный путь к первому файлу будет выглядеть так: http://site.ru/dir1/file1.html. Данный путь приведет именно к этому файлу, на какой бы из страниц Интернета ни была расположена данная ссылка.
Другое дело – относительные ссылки. Если в рассматриваемом примере нужно разместить ссылку на файл file1.html или file2.html, то в качестве пути достаточно будет задать просто имя файла, то есть file1.html. Тогда полностью тег ссылки будет выглядеть примерно так: <A HREF="FILE1.HTML">Ссылка</A>. При этом данная ссылка будет обрабатываться корректно, только если она находится в файле, размещенном в той же директории.
Разумеется, относительный путь короче и писать его удобнее. При этом он будет корректно работать, скажем, на локальном компьютере, пока пользователь тестирует работоспособность сайта. Поэтому в большинстве случаев его применение оправданно.
Иногда бывает необходимо, чтобы ссылка открывалась не в том же окне, что и основная страница, а в новом. В большинстве браузеров это можно сделать, удерживая нажатой клавишу Shift при переходе по ссылке. Однако нас интересует открытие ссылки в новом окне, независимо от воли пользователя. Для этого используется параметр TARGET со значением _blank. Полностью код выглядит так: <A HREF="HTTP://SITE.RU" TARGET = "_BLANK">Название ссылки</A>.
Гиперссылка может вести не только к документу, но и к конкретному месту в нем. Для этого в месте документа, на которое планируется установить ссылку, вставляется так называемый якорь. Выглядит это так: <A NAME="ЧИСЛО ИЛИ ИМЯ АНГЛИЙСКИМИ БУКВАМИ"><М>. Допустим, в качестве имени якоря в файле file1.html, находящемся в папке dir1, задали параметр metka1. Тогда абсолютная ссылка на него будет выглядеть так: <A HREF="HTTP://SITE.RU/ DIR1/FILE1.HTML#METKA1"> Название ссыпки<М>. Если же речь идет о ссылке из того же файла (то есть если нужно переместиться в другое место уже открытой страницы), то ссылка может быть описана следующим тегом: <A HREF=" #METKA1">Название ссыпки<М>).