WWW.DISSERS.RU

БЕСПЛАТНАЯ ЭЛЕКТРОННАЯ БИБЛИОТЕКА

   Добро пожаловать!

<ТН> , и Группы колонок: и Фреймы Организация переходов по фреймам <IFRAME> Устаревшие и нестандартные элементы <BGSOUND> <BLINK> <DIR> </dir> и <MENU> </menu> и LISTING <COMMENT> </comment> <PLAINTEXT> </plaintext> <NOEMBED> </marquee> <BANNER> </banner> Глава 4 • Объекты и формы Общие атрибуты объектов Рисунки и карты <IMG> <МАР> </map> Элементы объектов ЮЗ </applet> ЮЗ <OBJECT> </object> <PARAM> Общие атрибуты форм Содержание Элементы форм <ISINDEX> <INPUT> <LABEL></label> Пример формы НО <SELECT> <OPTION> </select> <TEXTAREA> </textarea> <BUTTON> <FIELDSET> <LEGEND> </fieldset> Глава 5 • Сценарии Что такое сценарий <NOSCRIPT> </noscript> Язык JavaScript Синтаксис Управляющие операторы Примеры сценариев Замена изображения Изменение свойств текста Метод Управление формами Сценарий для одного элемента Глава 6 • Приемы разметки гипертекста Стиль и традиции Не таблица, а табличка Заголовок и рисунок рядом Мозаичные рисунки Объединение ячеек таблицы Вложенные таблицы Форматирование линии Стихотворный текст Ссылки на файлы мультимедиа Компоновка Web-страниц Собственная Web-страница Глава 7 • Создание графики Форматы графических файлов Создание фона Прозрачность для GIF- и Программа Gif Construction Set Создание вращающегося значка Компоновка сложного GIF-файла Создание трехмерной вращающейся фигуры Иллюстрация Web-страницы Преобразование видео в GIF Инструменты рисования в Microsoft Office 2000 WordArt Графический редактор MS Image Composer Microsoft GIF Animator Глава Редакторы гипертекста HoTMetaL PRO 5.0 Microsoft Word 2000 Microsoft FrontPage Express Microsoft FrontPage 2000 Netscape Composer Приложение числа Приложение Б • Свойства таблиц стилей Единицы измерения Шрифты font-family font-style font-variant font-weight font-size font Форматирование текста text-indent text-align text-decoration text-shadow letter-spacing line-height word-spacing text-transform white-space direction Свойства списков list-style-type list-style-image list-style-position list-style Содержание Свойства таблиц display row-span column-span border-collapse border vertical-align table-layout Свойства границ элементов width и max-width height и position top, bottom, right, left margin-top, margin-right, margin-bottom, margin-left margin padding-top, padding-right, padding-bottom, padding-left padding border-top-width, border-right-width, border-bottom-width, border-left-width border-width border-top-color, border-right-color, border-bottom-color, border-left-color border-color border-top-style, border-right-style, border-bottom-style, border-left-style border-style border-bottom border-left border-right border overflow float clear clip visibility z-index Свойства фона и цвета color background-color background-image background-repeat background-attachment background-position background 12 Содержание Свойства мультимедиа volume speak speech-rate pause-before, pause-after pause cue-before, cue-after cue azimuth elevation Пользовательский интерфейс cursor color, background-color Приложение В • Состав прилагаемой дискеты Приложение Г • Источники информации в Интернете по тематике книги Алфавитный указатель Предисловие Появление всепланетной компьютерной сети Интернет (часто именуемой в нашей стране Сетью) внесло существенные изменения в жизнь многих людей. Дело не только в том, что мы получили качественно новое средство связи, реально объеди няющее народы. Это само по себе великое достижение. Но Сеть стала, в опреде ленном смысле, образом нашей жизни. Мы привыкаем к Интернет-кафе, журна лам об Интернете, анекдотам из Интернета, моде Интернета. Кроме удовольствия от получения новой информации и общения, люди научились извлекать практи ческую пользу из мира компьютерной связи. В Сети можно рекламировать това ры и услуги, продавать их же, искать работу, учиться, заявлять о себе миру (это самый быстрый и бронировать места в гостиницах и самолетах и выполнять еще много других полезных дел. Так уж получается, что люди долж ны осваивать работу в Сети. Но тут есть одна проблема: пользоваться Сетью все таки несколько сложнее, чем обычным телефоном. Чтобы помочь широкому кругу пользователей освоиться в пока еще новом для них виртуальном мире, предназна чена эта книга. Это переиздание моей книги «HTML в примерах», вышедшей в свет в 1997 году. С той поры многое изменилось, и материал был подвергнут суще ственной переработке. В этом мне очень помогли читательские отзывы. Всем их приславшим я выражаю огромную благодарность! Некоторые интересные разде лы я оставил без изменений: ведь не все читали первую книгу.</p><p> Если в дальнейшем появятся какие-нибудь дополнения к книге, комментарии или ответы на интересные вопросы читателей, я опубликую их на своей Web странице (в настоящее время ее адрес http://webcenter.ru/~agonch). На ней есть и электронная почта, при помощи которой можно отослать отзыв или вопрос.</p><p> Буду рад получить отзывы об этой книге (или пожелания по тематике следующих) по электронной почте agonch@online.ru.</p><p> Желаю удачной работы!</p><p> Алексей От издательства Ваши замечания, предложения, вопросы отправляйте по адресу электронной почты comp@piter-press.ru (издательство «Питер», компьютерная редакция).</p><p> Мы будем рады узнать ваше мнение!</p><p> Подробную информацию о наших книгах вы найдете на Web-сайте издательства http://www.piter-press.ru.</p><p> Глава Введение Прежде чем начать HTML, нам надо осознать следующее: HTML — это не только язык разметки гипертекста (HyperText Markup Language), а понятие более широкое, включающее в себя Интернет и локальные сети, редакторы, броу зеры, разнообразные программные продукты, компакт-диски, обучающие курсы, дизайн и многое другое. Ввести читателя в этот мир можно только спосо бом: усадив его за компьютер, подключенный к Сети.</p><p> Для кого предназначена эта книга Войди Интернет в нашу жизнь только как средство коммуникации, по типу графа или телефона, создавать эту книгу не имело бы смысла или, во всяком слу чае, ее надо было бы писать совсем по-другому. Но глобальная Сеть не только со единила пользователей всего мира, но и утвердилась в виде новых технологий на наших персональных компьютерах. Действительно, пользователь, который при обрел и установил на своей машине Microsoft Office, становится обладателем Интернет-технологии в готовом виде, независимо от того, подключен его компью тер к Сети или нет. Посетитель компьютерной выставки получает в подарок компакт-диск и обнаруживает, что просматривать информацию на нем удобнее всего при помощи Интернет-броузера. Энциклопедия Британика, поставляемая на компакт-дисках, содержит множество материалов в формате HTML.</p><p> Иными словами, средства, предназначенные для работы с Сетью, стали использо ваться и в других целях, с нею не связанных, а среди программного обеспечения, устанавливаемого на большинство персональных компьютеров, приложения для заняли свое почетное место.</p><p> В результате работа многих пользователей стала иметь большее отношение к Сети, чем они того сами, может быть, желали. Так, одним из способов самовыра жения стало создание личных страничек в Интернет. Многие коммерческие фир мы стали использовать Сеть для рекламы и сбыта своей продукции. Люди, заня тые поисками работы, получили возможность составлять резюме в формате Web-страницы и размещать эту информацию в Сети. Огромное значение Интер стал играть для научных, учебных и общественных организаций. Подтверж дение тому легко найти, выйдя на просторы Немного истории Я адресую эту книгу широкому кругу пользователей. Даже тем, кто не имеет до ступа к Интернету. Я убежден, что гипертекстовые технологии — область компью терного мира, в которой каждый неравнодушный человек может достичь успеха за короткое время. HTML — это своеобразная противоположность сложным языкам программирования (известным только специалистам) и современным прикладным пакетам, па освоение которых требуется затратить (увы!) немало времени.</p><p> Что есть в этой книге Первая глава является вводной. В ней рассказывается об Интернете и о том, как работать с броузерами. Главы посвящены собственно HTML: синтаксису языка, описанию элементов, примерам. Вы можете начать работу с создания про стой странички, а потом заполнить ее более сложными элементами.</p><p> В главах обсуждаются различные вопросы создания Web-страниц. Глава содержит описания нескольких гипертекстовых редакторов, которые могут быть полезны разработчику.</p><p> Все примеры записаны на прилагаемую к книге дискету, поэтому текст любого HTML-файла можно просмотреть, открыв файл в броузере или текстовом редакто ре. Список файлов, которые находятся на дискете, можно найти в приложении В.</p><p> Немного истории Как только на Земле появились первые два компьютера, инженеры задались целью обеспечить связь между ними и передать данные с одного на другой. Разумеет ся, с технической точки зрения в таком соединении не было ничего невозможного, и, поскольку компьютерная техника развивалась, компьютерные сети (вычисли тельные машины и линии связи между ними) стали появляться повсеместно.</p><p> Идея всепланетной компьютерной сети стала актуальной тогда, когда вычисли тельные машины перестали быть собственностью только учреждений и ведомств, то есть когда появились персональные компьютеры. Их потребовалось подклю чить к сети: так же, как это было сделано раньше с телефонами и факс аппаратами.</p><p> В 1994 году, когда я был на стажировке в США, мои американские коллеги поста рались приобщить меня к работе с системой, которая тогда еще была недоступна кругу пользователей в измученной кризисами России. Называлась эта система Интернет. Мне выдали книгу Эда Крола «Весь Интернет» (она вышла в свет в 1992 году и еще не успела устареть) и показали, как выходить на просторы Меня поразили тогда не масштабы Сети, а возможность за считанные минуты связаться с Австралией или Японией, хотя это было как бы само собой разумею щееся удобство. Я всегда понимал, что повсеместное создание компьютерных се тей должно привести к тому, что большинство компьютеров будут подключены к глобальной Сети, а сложности, связанные с протоколами, трафиком и обменом 16 Глава 1.</p><p> данными сведутся к минимуму. Иными словами, то, что использование глобаль ной Сети не будет уделом избранных, соответствующим образом подготовленных программистов и электронщиков, а станет доступным обычным пользователям, занятым решением своих повседневных задач, было для меня очевидным. Пора зило же меня другое.</p><p> Прежде всего, я совершенно не мог понять, каким образом можно передавать по те лефонной данные со скоростью 56 000 бит в секунду. И, главное, как после прохождения по реальной линии связи, имеющей довольно узкую полосу пропус кания и добавляющей шумы, эти данные оставались пригодными для использова ния в компьютере, где искажение бинарной информации, строго говоря, вообще не допускается. Не подумайте, что я ничего не знал о кодиро вании и коррекции ошибок. Это была моя институтская специальность, так что я вдоволь наслушался лекций и сдал немало экзаменов на эту тему. Но цифры не сходились, и это вызывало недоумение. Уж слишком большой казалась скорость передачи данных. К тому же, как истинный воспитанник застоя, я твердо знал, что нет в мире более ненадежной вещи, чем телефонная связь, тем более связь между городная. Все это вызывало чувство неудовлетворенности и сильное желание во всем разобраться. Американцы, к которым я обратился с вопросами, только по жимали плечами, что за проблема, мол, и дали мне еще одну книгу (ты инженер — вот и разбирайся, а нам некогда). В конце концов все встало на свои места. Оказа лось, что в Америке есть разные телефонные линии: аналоговые, которые пред назначены для голосовой связи, и специальные цифровые — для компьютерной техники. А главное, длина линии, используемой для цифровой связи, не превы шала километров. На такое расстояние высокочастотный сигнал еще можно передать без существенных искажений. А дальше телефонная компания брала все заботы на себя: усиливала сигнал, преобразовывала его и пересылала через опто волоконный кабель или через спутник. Ну, и наконец, с умом сделанная элек троника позволяла добиться максимума возможностей, то есть приблизиться к теоретическому пределу скорости передачи данных для каждой конкретной линии связи.</p><p> Ни для не секрет, как обстоит дело в России сейчас. Для подключения к Интернету используются обычные российские телефонные линии. У большин ства людей просто нет выбора. Многие наши пользователи не могут рассчитывать в ближайшем будущем на его появление. Современные модемы и программное обеспечение построены таким образом, что скорость передачи информации уста навливается автоматически в зависимости от качества линии связи. Если ошибок слишком много, и их не удается исправить, скорость передачи снижается. Это позволяет повысить помехозащищенность всей системы в целом, но время обмена данными, естественно, увеличивается. Мне приходилось наблюдать, как в подоб ном случае скорость уменьшалась до двух бит в секунду. Вы можете прикинуть, сколько времени потребуется для загрузки хотя бы одной картинки. То есть рабо тать связь, конечно, будет, но очень-очень медленно. Впрочем, не везде и не всегда дело обстоит так плохо. В большинстве случаев пропускная способность наших телефонных линий достаточна, чтобы работа с Интернетом доставляла удоволь ствие. Кроме того, вовсе не обязательно гнаться за рекордными показателями.</p><p> Немного истории Модем со скоростью передачи 14 400 бит в секунду (bps) обеспечивает вполне приемлемые условия работы, а эта скорость — далеко не предел. Я только хочу подчеркнуть, что в нашей телефонии известную роль играет случай: где-то линии хорошие, а где-то никуда не годятся.</p><p> Кроме скорости передачи данных меня удивило присутствие в Интернете россий ских ресурсов. «Путешествуя» по миру, можно было заглянуть и в отдельно взя тую страну под названием Россия. У нас одними из первых к Сети подключились физики. Это понятно: World Wide Web изобрели в организации, занимающейся физическими исследованиями — в Женевской лаборатории ядерной физики (CERN).</p><p> В 1989 году Тим Бенерс-Ли (Tim разработал гипертекстовую систе му, а в 1990 году там же был создан первый броузер, который так и назывался: WWW.</p><p> Поэтому российские физические институты были в числе первых организаций, создавших свои серверы. Помимо этого, в крупных городах коммерческие органи зации создавали собственные сайты (наборы Web-страниц), только вот смотреть их было некому. Из-за рубежа вид был малопривлекательный: вместо кириллицы шла мешанина из каких-то непонятных значков. Эта проблема со шрифтами не разрешена окончательно и по сей день. Но, тем не менее, это был прогресс. Возни кал естественный вопрос: сколько еще десятилетий Интернет в России будет оставаться экзотикой? К счастью, судьба оказалась к нам в этот раз благосклон ной, и «кончилось все Существует несколько стандартов для организации связи между клиентом (ком пьютером, принимающим информацию) и сервером (компьютером, который яв ляется источником информации). Среда World Wide Web основана на протоколе передачи гипертекста HTTP (HyperText Transfer Protocol), но позволяет исполь зовать протокол передачи файлов FTP (File Transfer Protocol), электронную поч ту (E-mail) и другие средства.</p><p> В любом случае, каждый компьютер, подключенный к Интернету, имеет два уни кальных адреса. Первый (IP-адрес), состоящий из четырех групп цифр (напри мер, 123.45.678.9), используется для программной обработки и ничего не говорит пользователю. Этот адрес требуется компьютерам-трассировщикам (почтальонам виртуального мира). Второй вариант адреса несет в себе смысловую информацию.</p><p> Например, адрес www.piter-press.ru говорит о том, что во Всемирной паутине есть сайт организации Питер Пресс (в данном случае издательства), который разме щен в домене русских серверов Каждый пользователь Интернета (человек или организация) может получить адрес электронной почты. Адрес строится по схеме:</p><p> Из существующих «почтовых» программ можно например, Pro или Outlook Express. В некоторых случаях электронная почта может быть даже удобнее телефона, так как не зависит от занятости линий, не требует присутствия абонента в момент получения сообщения, позволяет компенсировать разницу во времени для часовых поясов. Кроме этого, абонент имеет время на обдумывание ответа. При благоприятных условиях с помощью E-mail можно вести диалог 18 Глава 1. Введение «почти в реальном масштабе времени», с задержкой примерно в десять минут, E-mail — очень демократичный вид связи. Адрес электронной почты Президента США ни для кого (в Америке) не является секретом.</p><p> FTP используется для копирования файлов с компьютера на компьютер по Сети.</p><p> При необходимости, на компьютер-клиент может быть передан список файлов, находящихся в определенной папке компьютера-сервера. Здесь работы с файлами такой же, как в программах Norton Commander или Проводник Windows.</p><p> Пользователь может переименовывать или удалять файлы, копировать их на свой жесткий диск. Если вам надо «скачать» из Интернета какую-нибудь полез ную программу или файл архив), вы не обойдетесь без FTP. Если вы создали свою Web-страницу и хотите поместить ее на сервер, то вам также пона добится протокол передачи файлов.</p><p> В 1994 году книга Крола верно отражала суть работы в Сети: в ней последователь но разбирались все средства и протоколы, начиная с FTP и заканчивая World Web. В то время пользователь, желающий поработать, например, с какой нибудь библиотекой, связывался с ней при помощи протокола telnet (telnet средство для работы в текстовом интерактивном режиме с удаленным компьюте ром). На время сеанса компьютер клиента превращался в терминал, и на экран выдавались рекомендации по работе с информационно-поисковой системой биб лиотеки. Они, как правило, представляли собой сведения по несложному, но не стандартному языку, с помощью которого можно было управлять системой и формулировать запросы. «Достаточно» было изучить этот язык и можно было приступать к работе. Некоторые библиотеки предлагали пользователям зарегис трироваться в системе, а другие обеспечивали доступ только после ввода пароля.</p><p> Найденную информацию можно было загрузить на свой компьютер.</p><p> На фоне таких «потрясающих» сервисных система Gopher казалась намного более удобной. Она предусматривала наличие на каждом сервере собствен ного набора меню, который позволял получать доступ к необходимой информа ции, хранящейся на нем и других серверах мира. Пользователю Gopher Сеть представлялась некой гигантской системой меню, по которой можно было «ходить» до бесконечности, в том числе и по кругу, так как все разработчики узлов стара лись накопить побольше ссылок для заданной области, чтобы обеспе чить максимальное удобство своим клиентам. Gopher — симпатичный ушастый зверек, наподобие нашего крота. Предполагалось, что «электронный gopher» дол жен прокопать всю землю насквозь неограниченное число раз. А работа клиентов заключалась в том, чтобы просмотреть как можно больше ссылок. Самым попу лярным напутствием в то время было: «Happy gophering!» («Счастливого гофере Можно добавить, что доступ к графическим данным в Gopher осуществ лялся сравнительно редко: в основном работали с текстовыми документами.</p><p> Но была в Сети одна новинка. Ее показывали скорее как красивую игрушку, а не как средство повседневной работы. Я имею в виду World Wide Web — Всемирную паутину. Для работы в этой среде использовали броузер Mosaic (Мозаика) самый новый в то время и самый модный. Его и сейчас еще можно встретить, но он, конечно, безнадежно устарел. О том, что фирмы Netscape и Microsoft будут вести смертельную схватку за право диктовать моду в WWW, тогда ц подумать HTML как явление нашей жизни никто не мог. Самым привлекательным в World Wide Web казался доступ к гра фике. Пользователи загружали в компьютер фотографии земного шара, сделан ные со спутников, и сами определяли для себя прогноз погоды. Разумеется, он был точнее, чем прогноз, передаваемый по телевизору! Люди, привыкшие рабо тать с текстами в Сети или даже в текстовом режиме, сразу почувствовали дис комфорт. Mosaic, программа с графическим интерфейсом, работала заметно мед леннее, а, кроме того, на загрузку картинок тратилось много времени. Поэтому пользователи не сразу оценили преимущества и перспективность новой системы.</p><p> В то время как я знакомился с особенностями Сети, мои американские коллеги организовали в своей лаборатории совещание на тему: «Что лучше на будущее Gopher или Mosaic?» Аргументы участников той дискуссии были примерно сле дующие: «Да, Мозаика более современная, но она медленно работает. А к Gopher мы привыкли. И неизвестно, что будет удобнее для клиентов...» На это следовало возражение: все данные у нас подготовлены для Gopher, но ведь Мозаика более современная. На чем мы будем работать в будущем?» Интересно то, что специалисты рассматривали обе системы, сравнивая их друг с другом. Большин ство людей тогда еще не понимали, что одной из этих систем суждено скорое заб вение, а другую ждет небывалый взлет. Но это были последние мгновения «ста рой эры». Уже осенью того же года ставить подобный вопрос было бессмысленно.</p><p> Пользователей тогда взволновало известие о выходе второй версии броузера Netscape, которую надо было поскорее осваивать, потому что она поддерживала больше элементов языка разметки гипертекста — HTML. Про текстовые режимы все забыли. На повестку дня вышли задачи разработки Web-страниц.</p><p> Со временем в Интернете произошли определенные изменения. Электронная почта осталась такой же, как была, но были серьезно улучшены сами почтовые програм мы. Пользователи были избавлены от рутинных операций и проблем, связанных с декодированием сообщений. Gopher и telnet перестали активно использоваться.</p><p> FTP прочно удерживает свои позиции как надежное средство загрузки архивных файлов. Броузеры World Wide Web стали основным средством работы с Сетью.</p><p> Они поддерживают любой из протоколов Интернета из соображений совместимо сти и удобства. Популярность языка HTML достигла немыслимого уровня, а при менение гипертекста уже давно не ограничивается рамками Всемирной паутины.</p><p> HTML как явление нашей жизни HyperText Markup Language (язык разметки гипертекста) давно перестал быть просто языком программирования. Понятие HTML включает в себя различные способы оформления гипертекстовых документов, дизайн, гипертекстовые редак торы, броузеры и многое другое. Человек, изучивший этот язык, обретает возмож ность делать сложные вещи способами и, главное, быстро, что в компью терном мире значит не так уж и мало.</p><p> Гипертекст как нельзя лучше подходит для включения элементов мультимедиа в традиционные документы. Практически, именно благодаря развитию гипертек ста, большинство пользователей получило возможность создавать собствен ные мультимедийные продукты и распространять их на компакт-дисках. Такие 20 1. Введение информационные системы, выполненные в виде наборов HTML-страниц, не требуют разработки специальных программных средств, так как все необходимые инстру менты для работы с данными (Web-броузеры) стали частью стандартного про граммного обеспечения большинства персональных компьютеров. При таком подходе от пользователя требуется выполнить только ту работу, которая непо средственно относится к тематике разрабатываемого продукта: подготовить тексты, нарисовать рисунки, создать HTML-страницы и продумать связи между ними.</p><p> Неохваченными остались только технические проблемы, такие, как получение видеоизображений, качественного звука, тиражирование дисков и т, д.</p><p> HTML является основой моды в Интернете. Все, что обсуждается на страницах виртуальных журналов в Сети, в телевизионных передачах, посвященных Интер нету, так или иначе связано с языком разметки гипертекста: красивые рисунки, интерактивность Web-страниц, битва двух фирм-производителей броузеров (Microsoft и Netscape), бизнес, игры, и многое, многое другое. Пользователь, игно рирующий Интернет, добровольно обрекает себя на отлучение от целого мира.</p><p> HTML как основа создания Web-страниц имеет прямое отношение и к новому направлению изобразительного искусства — Web-дизайну. Художнику в Интер нете недостаточно просто нарисовать красивые картинки, оригинальный логотип, создать новый фирменный стиль. Он должен еще разместить все это в Сети, про думать связи между Web-страницами, чтобы все двигалось, откликалось на дей ствия пользователя, поражало воображение неискушенных клиентов, а у привер женцев Сети вызывало желание создать что-нибудь свое, оригинальное в этой области.</p><p> Терминология Однажды я дал моим немецким коллегам-программистам поработать на своем ноутбуке, на котором была установлена русифицированная версия Windows.</p><p> Один из этих программистов учился в нашей стране и хорошо знал русский язык.</p><p> - Как здорово переведена операционная система! — сказал он мне потом.</p><p> — Почему? — удивился я.</p><p> - Ну как же, ведь у вас «file» называется файлом, — ответил он.</p><p> Я потом часто вспоминал этот разговор, так как тема для технического писателя была весьма интересная. Действительно, англоязычное программное обеспечение попадало в нашу страну самыми разными путями, и в вычислительной технике сама собой складывалась уникальная лингвистическая ситуация. Существует ог ромное количество терминов, которые соответствуют по произношению англий ским словам. Программисты и электронщики разговаривают на своем, хорошо понятном им языке. Заимствованные слова имели только одно значение, и это было удобно. Такая система прижилась и стала восприниматься как сама собой разумеющаяся. Трудно было представить, что в других странах все не так. Любые попытки вводить отечественную терминологию глохли на корню и даже подвер гались насмешкам. Самый яркий пример — названия клавиш. Нам непривычно видеть на клавиатуре УДЛ вместо Del или ВСТ вместо Ins. Клавиатура так и осталась нерусифицированной. Подобные феномены объясняются прежде всего тем, что до недавнего времени никто серьезно не занимался локализацией фирменного программного обеспечения. Теперь положение изменилось. Появилось много программных продуктов, использующих русский язык. И вместе с тем возникли чисто русские термины: «папка», «карман», «ярлык», Я не хочу сказать, что это плохо. Просто это пока непривычно. А в некоторых случаях те ряется однозначность термина. Вдобавок уже существуют двойные термины:</p><p> Internet и Интернет. А может, пора уже писать «Виндоус», Жизнь покажет.</p><p> Сфере гипертекстовых технологий в этом смысле повезло намного больше. Слава Богу, никто не называет броузер (хотя иногда называют обозревателем), а для вайд веб» использовали красивое русское название «Всемирная паутина». Видимо, в каждом случае необходимо свое решение:</p><p> использовать русское слово или заимствовать английское. Гипертекст породил много специальных терминов. Часть их я хочу предложить вашему вниманию.</p><p> • Элемент (element) — конструкция языка HTML. Это контейнер, содержащий данные и позволяющий отформатировать их определенным образом. Любая Web-страница представляет собой набор элементов. Одна из основных идей гипертекста — возможность вложения элементов.</p><p> • Тег (tag) — начальный или конечный маркеры элемента. Теги определяют гра ницы действия элементов и отделяют элементы друг от друга. В тексте Web страницы теги заключаются в угловые скобки, а конечный тег всегда снабжает ся косой чертой.</p><p> • Атрибут (attribute) — параметр или свойство элемента. Это, по сути, перемен ная, которая имеет стандартное имя и которой может присваиваться опреде ленный набор значений: стандартных или произвольных. Предполагается, что символьные значения атрибутов заключаются в прямые кавычки, но некото рые броузеры позволяют не использовать кавычки. Это объясняется тем, что тип атрибута всегда известен заранее. Атрибуты располагаются внутри началь ного тега и отделяются друг от друга пробелами.</p><p> • Гиперссылка — фрагмент текста, который является указателем на другой файл или объект. Гиперссылки необходимы для того, чтобы обеспечить возможность перехода от одного документа к другому.</p><p> • Фрейм (frame) — этот термин имеет два значения. Первое — область докумен та со своими полосами прокрутки. Второе значение — одиночное изображение в сложном графическом файле (по аналогии с кадром кино фильма).</p><p> ПРИМЕЧАНИЕ Вместо термина «фрейм» в специальной литературе и локализованных программных продук тах иногда можно встретить термин «кадр» или «рамка».</p><noindex> <div class="reklama"> <center> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- dislib-kvadrat (text1) --> <ins class="adsbygoogle" style="display:inline-block;width:336px;height:280px" data-ad-client="ca-pub-9894471784993021" data-ad-slot="8516509936"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </center> </div> </noindex> <p> HTML-файл или HTML-страница — документ, созданный в виде гипертекста на основе языка HTML. Такие файлы имеют, как правило, расширения htm или html. В гипертекстовых редакторах и броузерах эти файлы имеют общее название «документ».</p><p> 22 Глава 1. Введение • (applet) — программа, передаваемая на компьютер клиента в виде от дельного файла и запускаемая при просмотре Web-страницы.</p><p> • Скрипт или сценарий (script) — программа, включенная в состав Web-страни цы для расширения ее возможностей. Броузер Internet Explorer в определен ных ситуациях выводит сообщение: «Разрешить выполнение сценариев на странице?» В этом случае имеются в виду скрипты.</p><p> • Расширение (extension) — элемент, не входящий в спецификацию языка, но использующийся, обеспечивая возможность создания нового интересного эффекта форматирования.</p><p> • CGI (Common Gateway Interface) — общее название для программ, которые, работая на сервере, позволяют расширить возможности Web-страниц. Напри мер, без таких программ невозможно создание интерактивных страниц.</p><p> • Программный код или просто код — аналог понятия «текст программы».</p><p> • Код HTML — гипертекстовый документ в своем первоначальном виде, когда видны все элементы и атрибуты.</p><p> • World Wide Web, WWW или просто Web — Всемирная паутина, распределен ная система доступа к документам, существующая в Интернете.</p><p> HTML является основным языком для создания документов в WWW. Изучая его, мы, фактически, изучаем часть этой системы, хотя область применения языка намного шире.</p><p> • Web-страница — документ (файл), подготовленный в формате гипертекста и размещенный в World Wide Web.</p><p> • Сайт (site) — набор принадлежащих одному владельцу.</p><p> • Броузер (browser) — программа для просмотра Web-страниц.</p><p> • Пользовательский агент (user agent) — броузер или другая программа, рабо тающая на компьютере-клиенте.</p><p> • Загрузка (downloading) — копирование файлов с сервера на компьютер клиент.</p><p> • URL (Uniform Resource Locator) или универсальный указатель ресурса адрес некоторого объекта в Интернете. Типичный URL для WWW имеет вид:</p><p> файла Здесь — это часть адреса, который часто употребляется для обозначения владельца сайта, а домен — обозначение крупного «раздела» Интернета: страны, области деятельности и т. д. URL используются для того, чтобы указать конкрет ную Web-страницу или графический файл в а также везде, где тре буется однозначно определить месторасположение Web-страницы или файла.</p><p> • Базовый URL — часть адреса, которая является общей для всех ссылок теку щей Web-страницы.</p><p> • Базовый цвет — каждый цветовой оттенок на экране монитора получается со единением трех базовых цветов: красного, зеленого и синего.</p><p> Особенности гипертекста Цветовой канал — интенсивность красного, зеленого или синего цвета на экране монитора. Цвет каждого пиксела определяется как комбинация этих трех величин.</p><p> Гамма-коррекция — создание нелинейной зависимости между реальной интен сивностью базового цвета и полученной яркостью на экране монитора. Изоб ражения, полученные без гамма-коррекции, оказываются более темными, так как монитор воспроизводит различные градации яркости нелинейно по отно шению к их числовому выражению. Изменение параметра «гамма» часто ис пользуют в графических редакторах при работе с изображением. На рис. 1. показан пример зависимости между реальной и необходимой яркостью.</p><p> 1SO 120 • о О 30 60 90 120 150 210 Рис. 1.1. Пример зависимости между исходной и необходимой величинами яркости пиксела Особенности гипертекста Если задаться вопросом, какова основная особенность гипертекстового документа, можно наверняка утверждать, что это — способность получать сложные эффекты форматирования простыми и наглядными методами. Давайте сравним гипертек стовый документ, например, с файлом в формате MS В том и другом случаях можно использовать одни и те же приемы форматирования: выбор шрифта, курсив, выравнивание, вставку таблиц, рисунков и т. д. Но в документе Word механизм форматирования скрыт от пользователя, работать с файлом можно только в самом редакторе или программе, поддерживающей его формат. Подобных продуктов срав нительно немного, и большинство из них разработаны фирмой Microsoft. С гипер текстом дело обстоит иначе. Такой документ можно открыть в любом текстовом редакторе и увидеть, где и каким образом отформатирован текст. Разумеется, про смотреть или распечатать документ в отформатированном виде возможно тоже только в специализированном приложении — гипертекстовом редакторе или броузере.</p><p> Открытость структуры гипертекстовых документов позволяет фирмам-разра ботчикам создавать самые разные программные продукты, а пользователь может выбрать себе подходящую программу.</p><p> 24 1. Введение Разработчик HTML-документа может выбрать способ работы с ним. Теоретиче ски с гипертекстом можно работать даже на уровне MS-DOS в любом редакторе, открывающем ASCII-файлы. Правда, это требует от пользователя обязательного знания большинства элементов HTML. Можно использовать для создания гипер текста и броузер. Любая из этих программ имеет режим редактирования Web страницы в режиме «источника». Для этого может подключаться один из уста новленных на компьютере текстовых редакторов. Броузеры имеют и встроенные редакторы гипертекста. Наконец, существуют гипертекстовые редакторы, кото рые используются только для разработки Web-страниц и создания на последних всевозможных визуальных и звуковых Способ создания гипертекста обеспечивает его абсолютную платформенную независимость. Создавая Web-страницы на компьютере, который работает под управлением Windows, вы можете не сомневаться, что администратор сервера сможет использовать ваши файлы на компьютере, работающем под управлением UNIX или другой операционной системы.</p><p> Одной из основных особенностей HTML является принцип, по которому не толь ко допускается вложение одних элементов в другие, но и декларируется необхо димость такого вложения. Это отличает HTML от многих других языков, в кото рых теоретически можно написать код без вложенных конструкций. В данном случае, это невозможно изначально. Каждый элемент допускает непосредствен ное вложение только ряда элементов, которые, в свою очередь, допускают вло жение других, разрешенных для них, и т. д. Таким способом формируется не только общая структура гипертекста, но и создаются разнообразные визуальные эффекты.</p><p> Все элементы языка можно условно разделить на три группы. К первой относятся элементы, которые создают структуру гипертекстового документа. Использова ние таких элементов — необходимая формальность, которой нельзя пренебре гать. Ко второй группе можно отнести элементы, создающие эффекты формати рования. Их использование диктуется конкретными требованиями к документу, фантазией и компетенцией разработчика, К третьей группе относятся элементы, которые позволяют управлять программными средствами, установленными и работающими на компьютере-клиенте. Часто такие элементы создаются автома тически, когда разработчик использует для вставки некоторого объекта в доку мент гипертекстовый редактор или подобную программу.</p><p> Несмотря на то, что спецификация HTML является стандартом, этот язык допол няется новыми элементами (расширениями). Поэтому некоторые Web-страницы удобнее просматривать при помощи определенных броузеров. Расширения созда ются только известными фирмами, которые разрабатывают программное обеспе чение для WWW, а рядовые пользователи могут совершенствовать свои Web-стра ницы при помощи программирования. позволяют снять ограничения HTML и дают простор разработчика.</p><p> В каждой главе этой книги обсуждаются свои особенности применения HTML, и то, о чем здесь говорится вкратце, далее будет рассмотрено более подробно.</p><p> Просмотр Просмотр Web-страниц Прежде чем начинать создание собственных HTML-документов, полезно позна комиться с программами, необходимыми для просмотра таких документов — бро узерами. Последние используются не только как средство просмотра, но и как поч товые программы, а также как средство загрузки файлов посредством FTP. Нам потребуется изучить две основные функции броузеров: просмотр Web-страниц и редактирование их содержимого (элементов HTML).</p><p> Несмотря на то, что в мире создано немало программ для просмотра HTML-доку ментов и даже специализированных редакторов, выбор пользователя всегда огра ничен. Это объясняется прежде всего тем, что в гипертекстовую технологию по стоянно вносятся дополнения, и программы перестают удовлетворять последним требованиям. Сейчас уже почти не осталось приверженцев броузера Mosaic, хотя сравнительно недавно это был очень популярный продукт. И до сих пор есть еще фирмы, которые пытаются продолжать его развитие.</p><p> Кто из специалистов по Интернету не слышал таких названий, как Cello, Global Network Navigator или Netcom's Однако в настоящее время пользова тели выбирают продукцию одной из двух фирм: Microsoft и Netscape. Именно им удалось найти решения, завоевавшие всеобщее признание. А тот факт, что обе фирмы постоянно изыскивают возможности реализовывать в своих программах поддержку нововведений конкурента, является причиной быстрого развития ги пертекста. Пользователи в этой ситуации только выигрывают, получая в свое рас поряжение все новые и новые, самые современные программные продукты.</p><p> И все же есть одна область, где даже малоизвестные и броузеры применяются с успехом. Я имею в виду компакт-диски, на которых размещены гипертекстовые файлы. Здесь разработчик заранее знает, какие документы при дется воспроизводить (что напрочь уничтожает проблемы совместимости, такие актуальные для «узкоспециализированных» а необходимость лицен зирования приводит к использованию продукции никому не известных доселе фирм. Потребитель, в свою очередь, освобожден от необходимости устанавливать на своем компьютере дополнительное программное так как все, что ему необходимо, записано на диск.</p><p> Мы познакомимся с двумя наиболее популярными броузерами, которые обеспе чивают корректный просмотр гипертекста в подавляющем большинстве случаев.</p><p> Microsoft Internet Explorer Этот броузер фирмы Microsoft удобен в первую очередь тем, что является полнос тью русифицированным. Вы можете использовать версию 4 или 5. Microsoft Internet Explorer (MSIE) настолько тесно интегрирован с Windows, что его труд но назвать автономной программой. Скорее, это один из компонентов операцион ной системы.</p><p> Работа с броузером может начинаться с подключения к Интернету или вестись автономно, если все необходимые файлы находятся на локальном жестком диске 26 Глава 1. Введение (то есть диске своего компьютера). В поле Адрес на панели инструментов указы вается URL. Он может совпадать с IP-адресом, а может содержать и дополнитель ную информацию, необходимую для идентификации определенного документа.</p><p> Адрес предваряется кодом, который определяет, с какой подсистемой Интернета мы хотим работать. Например, если мы ищем компанию Microsoft, то адрес дол жен быть таким: http://www.microsoft.com.</p><p> Код http указывает на то, что программа должна работать с системой гипертексто вых документов и использовать соответствующий протокол Transfer Protocol). Но могут быть и другие варианты адреса. Например, адреса с кодом ftp указывают на архивы файлов, доступных по FTP, код mailto обозначает адреса электронной почты, код file — файлы на собственном компьютере. Для трени ровки попробуйте, например, загрузить на свой компьютер файлы с адреса ftp://ftp.microsoft.com.</p><p> После указания URL броузер загружает данные из Интернета и демонстрирует нам гипертекстовый документ, находящийся по заданному адресу (рис. 1.2).</p><p> 1 I Microsoft here to learn more com Home (Exact q The business operating system for the next generation of PC computing is en route to computer manufacturers and and should be generally Product Family available to customers on February 17, In the you can peruse Microsoft's new Tools comprehensive online resource designed to help you Office evaluate and deploy Windows 2000, • Shop at • Behind Scenes of tf»e Customer Store to • on the MSN..</p><p> IT Online New. • Microsoft Our Рис. 1.2. Окно MS Internet Explorer Найдя какую-нибудь организацию, мы вначале увидим ее «домашнюю» страницу (home page). На ней легко обнаружить подчеркнутые надписи. Это ссылки на другие страницы. Весь комплекс страниц (сайт) очень велик, и его нельзя увидеть целиком. Гиперссылки позволяют передвигаться по страницам или частям одной большой страницы. Гиперссылкой может быть не только надпись, но и значок, Просмотр Web-страниц рисунок или часть рисунка. О том, что это гиперссылка, можно догадаться по из менению внешнего вида указателя мыши. Передвижение по сайту можно уподо бить хождению по лабиринту, поэтому броузер снабжен кнопками Вперед и Назад, которые позволяют вернуться к пройденным страницам. Каждой странице соот ветствует один или несколько файлов, которые броузер помещает в папку вре менного хранения (кэш). Поэтому, когда вы хотите вернуться к уже загруженной странице, программа считывает ее не из Интернета, а с жесткого диска. Время доступа к документу значительно Бывает и так, что с загрузкой страницы возникают проблемы. Тогда пользователь может прервать загрузку щелчком па кнопке Остановить.</p><p> Применять эту кнопку следует в нескольких случаях. В первую очередь, когда страница еще загружается, а вам уже ясно, что она вам не понадобится. Кнопка бывает полезна и в том случае, когда на странице графики и нет времени ждать, пока вся она загрузится. Ну, и наконец, бывают ситуации, когда броузер «зацикливается», то есть пытается открыть несуществующий документ. В этом случае также выручает эта кнопка.</p><p> И наоборот, загрузку текущей страницы можно повторить, щелкнув на кнопке Обновить. При работе с Интернетом она используется редко, а для разработчика гипертекстовых документов — это инструмент.</p><p> Если вы что-то изменили в своем файле, то увидеть, как он теперь будет выгля деть, можно только перезагрузив документ.</p><p> Ниже представлены другие важные кнопки броузера.</p><p> Переход на страницу, которая была открыта ранее. Это очень удоб ное средство передвижения по документам. Движение вперед обес печивает гиперссылка, а возможность вернуться назад присутствует «Домашняя страница» (home page) — понятие условное. Каждая фир ма, работающая в Сети, имеет свою собственную домашнюю страницу.</p><p> Вы можете использовать в качестве таковой свою страницу, страницу своего провайдера, производителя программы или любую другую. Адрес домаш ней страницы указывается в качестве параметра программы и может быть изме нен (команда Сервис Свойства обозревателя).</p><p> Поиск в Интернете осуществляется путем перехода к странице какого либо поискового сервера. В настоящее время существует множество поисковых серверов, и вы можете выбрать любой, а адрес страницы по иска также задается в качестве параметра.</p><p> Каталог ваших любимых или необходимых вам Web-страниц. Исполь зуя эту кнопку, вы можете добавить текущую страницу в список избран страниц или дать команду броузеру загрузить любую из страниц, перечисленных в списке.</p><p> 28 Глава 1. Введение Вывод на печать текущего документа. На Web-страницах иногда при сутствуют детали, которые не могут быть распечатаны, но в целом броу зер производит форматирование для вполне удовлетворительно.</p><p> Изменение размера шрифта на текущей странице. Это очень удобный инст румент. Не задавая лишних вопросов, программа увеличивает или умень шает размер букв. Таким образом решается проблема в двух случаях: ког да текст на странице слишком мелкий или когда он, наоборот, неоправданно крупный.</p><p> Некоторые Web-страницы устроены таким образом, что просмотр их компонен тов вызывает открытие еще одного окна броузера. Поэтому, поработав в Сети, вы можете обнаружить, что у вас открыты два или три окна MSIE. За этим нужно следить при помощи значков на панели задач, и закрывать ненужные окна, чтобы не перегружать компьютер.</p><p> Web-страницы часто оборудованы средствами электронной почты. Щелкнув на определенной ссылке, вы можете активизировать диалог для создания почтового сообщения. Если вы его напишете и отправите, то программа все сделает автома тически: вам даже не надо будет думать об адресе получателя. Другим средством «обратной связи» являются формы. Заполнив соответствующие поля и щелкнув на кнопке «отправить» (которая может иметь в форме название Go, Submit или другое), можно переслать на сервер необходимую информацию. Так, напри мер, происходит заказ товаров в Интернет-магазинах или заполнение анкет во время виртуальных опросов.</p><p> С Web-страницами и их компонентами (например, рисунками) можно поступать как с обычными документами: сохранять на диске под определенными именами или распечатывать. Чтобы открыть локальный файл в Internet Explorer, достаточ но ввести в поле Адрес ссылку на файл. Простейший вариант — указать путь и имя:</p><p> Можно записать ссылку по всем правилам, как для работы в Сети:</p><p> htm А сам броузер MSIE «предпочитает» такой формат:</p><p> htm Все три способа записи адреса легко распознаются броузером: программа состав лена так, что выбирает из ссылки только полезную информацию, а сколько косых черточек идут подряд и в какую сторону они наклонены — это детали, которыми современное приложение пренебрегает.</p><p> Чтобы открыть файл в режиме диалога, надо использовать команду Файл Открыть.</p><p> При этом активизируется окно, показанное на рис. 1.3. В нем доступ к папкам осу ществляется после щелчка на кнопке Обзор.</p><p> Наконец, чтобы совсем не тратить время на поиск файла, пользователи Windows могут создать ярлык Web-страницы на рабочем столе. Для этого надо выполнить следующие действия.</p><p> Откройте Проводник Windows, а в нем папку с необходимым файлом.</p><p> 2. Выберите файл и щелкните на нем правой кнопкой мыши.</p><p> Просмотр Web-страниц Рис. 1.3. Окно для открытия HTML-документа 3. Выберите в контекстном меню команду Создать ярлык.</p><p> 4. Перетащите появившийся в папке ярлык на поверхность рабочего стола.</p><p> 5. Чтобы запустить броузер и сразу же открыть в нем документ, щелкните на этом ярлыке один или два раза (в зависимости от настроек рабочего стола).</p><p> Для работы в локальном режиме этот способ запуска броузера — наилучший, так как позволяет избежать потери времени на попытку броузера подключиться к Интернету.</p><p> При помощи Web-страниц с ярлыками можно существенно облегчить себе пользо вание Интернетом или локальными ресурсами. Собранные на странице ссылки по определенной тематике превращают ее в аналог папки Избранное. Иными сло вами, можно легко сделать набор справочников со ссылками на интересные Web страницы.</p><p> Можно иметь и несколько папок для избранных страниц. Точнее, несколько па пок внутри папки Избранное. Для этого надо выбрать команду Избранное Упоря дочить избранное, а затем в открывшемся окне щелкнуть на кнопке Создать папку.</p><p> После того как вы дадите новой папке имя, можете перетаскивать в нее ярлыки из основной папки. В дальнейшем, при просмотре содержимого папки Избранное, созданные внутри нее папки будут раскрываться после щелчка на них мышью.</p><p> Папка Избранное хранит не сами документы, а только ссылки на них. Если страни ца расположена не локально, то для ее просмотра потребуется подключение к сети. В случаях возникает необходимость иметь копии реальных доку ментов на своем компьютере. Тогда пользователь должен сохранить выбранные файлы в одной из своих папок. На кэш в этом случае полагаться нельзя, так как его содержимое регулярно обновляется.</p><p> Существует несколько команд для сохранения просмотренных документов. Файл > Сохранить как позволяет скопировать текущую Web-страницу в папку, выбранную пользователем. При этом копируется не только сам HTML-документ, но и рисун ки. Для сохранения одного рисунка надо щелкнуть на нем правой кнопкой мыши и выбрать команду Сохранить рисунок как в контекстном меню.</p><p> Средства просмотра HTML-кода дают возможность сохранить документ и даже модифицировать его. Команда Файл Править в Microsoft Front Page позволяет подключить гипертекстовый редактор, который выбран в окне свойств обозре вателя. Команда Вид В виде HTML открывает выбранную страницу в Блокноте.</p><p> X 30 Глава 1. Введение Редактирование страниц в режиме источника очень удобно, так как можно увидеть результат внесенных изменений: после модификации страницы ее надс сохранить в текстовом редакторе, а затем в броузере щелкнуть на кнопке Обновить.</p><p> Часто при просмотре страниц возникает проблема со шрифтами. Если шрифт на странице слишком мелкий или, наоборот, неоправданно крупный, вид документа легко исправить. Используйте команду Вид Размер шрифта, чтобы изменить раз мер шрифта на время просмотра. Буквы можно как уменьшить, так и увеличить, При этом на странице сохраняются пропорции различных шрифтов и заголовков.</p><p> Основные инструменты для настройки броузера собраны в окне Свойства обозре вателя, которое активизируется одноименной командой меню Сервис. На просмотр HTML-страниц влияют параметров. На вкладке Общие имеются кноп ки Цвета, Шрифты, Языки и Оформление, с помощью которых можно установить ре жимы воспроизведения страниц. В броузере назначаются для использования по умолчанию два шрифта: пропорциональный и моноширинный. Два разных типа шрифта необходимы для прорисовки данных из соответствующих Какие именно шрифты надо применять, выбирает пользователь. Важен также и выбор кодировки: для русскоязычных документов применяют или КОИ-8. Можно выбрать и цвета, которыми будут раскрашены текст, прой денные и неиспользованные гиперссылки.</p><p> На этой вкладке можно получить доступ к параметрам настройки кэша. Эти пара метры позволяют просмотреть содержимое папок кэша (кнопка Настройка в груп пе Временные файлы Интернета) и скопировать оттуда необходимые файлы, кото рые были загружены из Сети. При необходимости файлы временного хранения можно стереть, освободив место на диске.</p><p> На вкладке можно установить режим, при котором на странице не будут воспроизводиться рисунки или мультимедийные компоненты.</p><p> На вкладке можно выбрать приложения, которые будут использовать ся по умолчанию совместно с броузером (HTML-редактор, программа электрон ной почты и др.).</p><p> Netscape Communicator Этот комплект программ (в настоящее время русифицирована его версия 4.06) привлекает к себе внимание многими положительными свойствами. Его попу лярность во всем мире весьма высока, и не только потому, что пользователи привыкли работать с его более ранними версиями. Интересными, например, представляются комментарии в строке состояния, которые дают представление о процессе загрузки страницы. Удачно, на мой взгляд, организован доступ к пара метрам. Броузер называется Netscape Navigator, а встроенный редактор гипертек ста — Netscape Composer. В броузере реализована возможность создания закладок, что значительно облегчает поиск страниц. Несомненным удобством является легкость переключения между режимами броузера и редактора. Окно броузера показано на рис. 1.4.</p><p> Просмотр Web-страниц Take a survey a chance to win $ 4.7: CD/Download Distance Netscape Netcenter Guided Home Pages browsers ml features.</p><p> Games shopping i old will ex Easy and Free.</p><p> Рис. 1.4. Окно броузера Netscape Navigator Рассмотрим основные программы. Они, в основном, такие же, как и в MSIE.</p><p> Возврат к странице, которая была открыта раньше текущей.</p><p> Переход к которая была открыта позже текущей.</p><p> Повторение загрузки По умолчанию эта кнопка обеспечивает переход на домашнюю страницу (home page) Netscape, но пользователь может настроить программу на любую страницу, используя окно параметров (команда Правка Настройки).</p><p> Активизация поиска в Интернете.</p><p> Кнопка для перехода на страницу любителей Netscape. «Мой Net scape» — виртуальный клуб, в котором можно сделать свою страничку и получить адрес электронной почты.</p><p> 32 Глава 1. Введение Традиционная кнопка для печати текущей страницы. А в меню Файл как и положено современной программе, имеются команды Страницы, Предварительный Просмотр и Печать, которые позволяют настро ить параметры и выполнить просмотр документа перед печатью.</p><p> Останов загрузки текущей страницы. Загрузка может быть на после щелчка на кнопке Обновить.</p><p> Раньше кнопка логотипом фирмы-производителя традиционно зовалась для инициирования загрузки страницы. Теперь такая практически не нужна, и в данном броузере щелчок на логотипе на домашнюю страницу Netscape. Как правило, логотип снабжается анимацией которая действует в течение загрузки текущей страницы.</p><p> В этом броузере, как и в предыдущем, есть поле Адрес. Но в отличие от раскрывающемся списке этого поля можно выбрать все недавно ся адреса, а не только те, которые введены в строке вручную. Похожие выполняет журнал (команда Компоненты Журнал). В журнале приводится использованных адресов, а щелчок на адресе позволяет выполнить загрузку.</p><p> один сервисный инструмент — файл закладок. Он является аналогом папки ное в Windows. Для доступа к закладкам на панели инструментов есть ная кнопка.</p><p> На формат отображаемой страницы влияют команды меню Вид. С его устанавливается размер шрифта, кодировка страницы и другие параметры. Есть команда Остановить анимацию, то есть смену изображений в рисунках формата GIF. Для возобновления анимации необходимо страницу (щелкнуть на кнопке Обновить).</p><p> По аналогии с «пользователями» Windows, Netscape Communicator создавать своих «пользователей», то есть варианты настроек программы (их называют профили или конфигурации). Перед началом работы необходимо брать одну из этих конфигураций. Для каждого «пользователя», создается ственный файл закладок, и кэш. Журнал связан с файлами кэша, так при помощи журнала открываются страницы, которые когда-то были загружень:</p><p> из Интернета. Как журнал, так и кэш при необходимости можно очистить, делается это разными путями. Журнал очищается кнопкой в окне настроек да Правка Настройки). Обратите внимание (рис. 1.5), что необходимая настроек выбирается при помощи дерева в левой части окна диалога. Для кэша необходимо выбрать ветвь Кэш в разделе Дополнительные настройки.</p><p> В Netscape Navigator можно выбрать те же параметры просмотра, что и в MSIE шрифты, используемые по умолчанию, цвета просмотренных и непросмотренных ссылок. Можно также выбрать определенный фон для всех просматриваемых страниц или вообще отказаться от фона. Это особенно удобно при разработке собственных страниц.</p><p> Броузеры позволяют загружать страницы без рисунков. Это, конечно, информативность документов, но ускоряет работу. Для отказа от отображения рисунков в NN надо сбросить флажок Автоматическая загрузка изображений в кате гории параметров Дополнительные настройки.</p><p> Просмотр Web-страниц Цвета !•• Языки I- Приложения Browsing ffi и Группы Composer •• Публикация Автономный режим Загрузка 9 • Дополнительные Кэш ••• •• Дисковое " Ё т Рис. 1.5. Окно настроек Netscape Navigator Если флажок сброшен, становится доступной команда Вид > Показать рисунки и кнопка Рисунки, которые позволяют загружать графические компоненты по разрешению пользователя.</p><p> Диалог для открытия расположенных локально, в MSIE и NN имеет осо бенность: используются два окна диалога, а не одно, как в большинстве программ.</p><p> Только во втором окне пользователь получает доступ к традиционному списку дисков папок и файлов. Надо заметить, что для задания адреса необходимой стра ницы, расположенной на жестком диске, достаточно ввести путь к HTML-файлу в ноле Адрес.</p><p> В меню Файл есть команда Сохранить как, которая используется для копирования текущей страницы в папку, выбранную пользователем. При этом можно выбрать формат файла: HTML или текстовый. В отличие от MSIE, который позволяет сохранить Web-страницу вместе с рисунками, NN копирует только файл страницы. Сохранение файла страницы требуется только в случаях, так как вся страница автоматически записывается в кэш. Текстовый формат удобен, например, в тех случаях, когда надо распечатать только текст страницы, не отягощая его элементами оформления и рисунками. Зато если вы откроете в редакторе Netscape Composer, то сможете сохранить ее в но вой папке целиком (с рисунками).</p><p> 34 Глава 1. Введени Для просмотра элементов HTML в NN служит команда Вид Код страницы. Эле менты красиво выделяются цветом, и код легко читать, но редактировать его этом случае нельзя.</p><p> Поскольку в этой книге рассказывается о самых разных программах для работы гипертекстом, я рекомендую выбрать для себя определенный набор программ ] решить, как сохранять созданные файлы (файлов со временем накапливаете:</p><p> много). Иными словами, вам необходим броузер, гипертекстовый редактор набор папок для хранения результатов своего труда.</p><p> А вообще, с гипертекстом и с сопутствующими программами надо эксперимента ровать. Ни в одной другой области вычислительной техники вы не найдете разнообразия приемов и эффектов. К тому же, для поиска информации вам до ступен целый мир: в буквальном смысле — вся планета, а в переносном — удиви тельный виртуальный мир под названием Интернет.</p><p> Глава Синтаксис HTML В этой главе рассматриваются основные принципы создания конструкций HTML.</p><p> Существуют общие правила составления гипертекстовых документов, которые надо узнать прежде, чем начать изучение элементов языка. Не отчаивайтесь, если назначение каких-нибудь элементов, приведенных в качестве примеров, покажет ся вам неясным. Большинство элементов будут подробно обсуждаться позднее.</p><p> В этой главе надо обратить внимание на правила написания тегов и использова ния атрибутов, а также на проблему кодировок. Приведенный в качестве образца шаблон Web-страницы во многих случаях подойдет в качестве заготовки для кон струирования самых различных страниц.</p><p> Версии HTML Первая версия HTML была разработана в начале 90-х годов Тимом Бенерс-Ли для популярного в прошлом броузера Mosaic. Но в те времена ни для броузера, ни для самого языка еще не нашлось достойного применения. В 1993 году появился HTML+, и эта версия также осталась практически незамеченной. Начало широ кому использованию гипертекста дала версия 2.0, которая появилась в июне 1994 года.</p><p> Это был момент начала роста популярности WWW по всему миру. Элементы, включенные в версию 2, в большинстве своем используются и по сей день.</p><p> В версии 3.0 HTML, которая появилась год спустя, была реализована возмож ность прорисовки математических символов (знаков интеграла, бесконечности, дроби, скобок и т. д.) при помощи элементов языка. Под эту версию разрабатыва лись и броузеры (Arena). Но этот проект оказался тупиковым и не получил даль нейшего распространения.</p><p> В 1996 году появился HTML версии 3.2. Это было новаторское решение, доста точно упомянуть, что в спецификацию языка были введены фреймы, которые стали теперь весьма популярными у разработчиков Web-страниц. Даже сейчас на осно ве этой спецификации можно реализовывать очень неплохие дизайнерские реше ния. Практически все современные броузеры стопроцентно поддерживают вер сию 3.2, поэтому у авторов не возникают сомнения по поводу работоспособности заявленных элементов.</p><p> Наряду с официальными спецификациями языка, которые разрабатывались орга низацией (W3 компании-производители броузеров создава ли собственные элементы (расширения). Впоследствии некоторые из этих эле ментов, после получения всеобщего признания, включались в спецификацию 36 Глава 2. Синтаксис следующей версии языка. Интересно, например, что новаторское решение фреймы, — которое так полюбилось многим разработчикам, не было включено спецификацию 3.2. Но броузеры поддерживали фреймы, и многие книги, посвящен HTML, содержали описания фреймов без упоминания о том, что это нестан элементы. И это было правильно, потому что фреймы стали де-факто. В версию языка 4 они уже были включены на полном И наоборот, элементы APPLET и SCRIPT, необходимые для расширения HTML ми программными кодами, в версии 3.2 не сыграли той роли, которую были при званы сыграть. Это объяснялось тем, что броузеры различных версий интерпретировали программы на языках Java, JavaScript, Visual Basic (VBScript В результате не удавалось получить достаточно надежно работающий код, и дан ные языки использовались любителями HTML в основном для экспериментов.</p><p> Официальная спецификация HTML 4 (Dynamic HTML) появилась в В это время уже было очевидно, что дальнейшее развитие гипертекста будет осуще ствляться за счет скрипт-программирования. Это оказалось намного более чем вводить в язык все новые элементы. Появившиеся в то время броузе (Netscape Navigator 4, Microsoft Internet Explorer 4 и др.) уже надежно интерпретировали программный код (был достигнут определенный уро вень стандартизации). Однако проблемы у разработчиков еще остались. В стве примера можно отметить, что многие скрипты начинаются с версии броузера, чтобы потом использовать тот или иной фрагмент кода. Очевид но, что на программиста ложится обязанность тестирования страниц на все;</p><noindex> <div class="reklama"> <center> <a rel="nofollow" target="_blank" href="http://www.dobrota.biz/stati/chto-takoe-saentologiya.php" title=""> <table> <tr> <td> <img src="http://www.dobrota.biz/stati/images/scientology.jpeg" border="0" alt="" hspace="30" vspace="20" align="right" width=130 > </td> <td> <font size=+3>Узнайте, что такое Саентология... </font><br><br> <center><font color=red size=+1>Ваша жизнь поменяется...</font><br><br> </center> </td> </tr> </table> </a> </center> </div> </noindex> <p> популярных в настоящее время броузерах. Кроме того, актуальной проблема использования старых или не очень популярных программ.</p><p> по праву считаются компании Microsoft и Netscape, но вед] существуют еще и другие фирмы...</p><p> В результате использование всех возможностей Dynamic HTML стало программистов достаточно крупных организаций, где есть условия для сложных программ и всестороннего их тестирования. Создателям Web-страниц подчас приходится искать компромисс между надежностью и торством, чтобы получить достаточно грамотный HTML-код.</p><p> Анатомия Web-страницы Ниже показана заготовка типичного Web-документа. На этом примере мы смотрим структуру HTML-страниц. Я назвал этот файл Strukt.htm.</p><p> Листинг 1.1. Пример (шаблон) Web-страницы <HTML> <HEAD> <STYLE> H2 Arbat;</p><p>} CODE </style> Анатомия Web-страницы HTML, document, </head> <BODY Комментарий к странице --> <HR> <Н1>Заголовок <Н2>Заголовок 2</h2> <НЗ>Заголовок 3</h3> 4</h4> 5</h5> 6</h6> <HR> Здесь расположена <HR> <Р>Здесь должен располагаться оригинальный текст Web-страницы <HR> <А Переход в <А документа </body> Если рассмотреть исходные тексты различных Web-страниц, то можно легко уви деть схожесть их структур. Это объясняется тем, что документы создаются по опре деленным правилам. В основу синтаксиса языка HTML лег стандарт ISO 8879: «Information processing. Text and office systems. Standard Generalized Markup Language Правда, существует большое различие между стандартом официальным и стандартом фактическим. HTML постоянно развивается, допол няется новыми элементами, и изучать его надо не по официальным первоисточ никам, а на практике, обращаясь к последним разработкам ведущих фирм и спе циалистов.</p><p> Чтобы понять структуру Web-страницы, необходимо рассмотреть элементы, входящие в приведенный выше листинг. При рассмотрении элементов языка я буду приводить оба тега: начальный и конечный. Например: <I> </i>. Этим я хочу подчеркнуть, что в большинстве случаев разработчик должен использовать два тега для каждого элемента. Число случаев, когда допустим только начальный тег (часть элементов не имеют конечного вообще), невелико, и они специально оговариваются. Для имен тегов можно использовать как прописные, так и строч ные буквы латинского алфавита. Некоторые пользователи записывают начальные теги прописными буквами, а конечные теги — строчными. Это помогает разобрать ся в исходном тексте Web-страницы.</p><p> Глава 2. Синтаксис HTML • </html> Обозначение документа на языке HTML. Я уже упоминал о том, что одним и:</p><p> принципов языка является многоуровневое вложение элементов. Данный эле мент является самым внешним, так как между его и конечным должна находиться вся Web-страница. В принципе, этот элемент можно рассмат ривать как формальность. Он имеет атрибуты version, lang и которыми в дан ном случае редко кто пользуется, и вложение элементов HEAD, BODY FRAMESET и других, определяющих общую структуру Web-страницы. Естественно что конечным тегом заканчиваются все подобные документы.</p><p> <HEAD> </head> Область заголовка Web-страницы. Иными словами, ее первая часть. Так же, как предыдущий элемент, HEAD служит только для формирования общей документа. Этот элемент может иметь атрибуты lang и должен включать мент TITLE и допускает вложение элементов BASE, МЕТА, LINK, OBJECT, SCRIPT, STYLE.</p><p> </title> Элемент для размещения заголовка Web-страницы. Строка текста, расположен ная внутри этого элемента, отображается не в документе, а в заголовке окна броу зера. Эта строка часто используется при организации поиска в WWW.</p><p> авторы, создающие Web-страницы для размещения в Сети, должны позаботиться о том, чтобы эта строка, не будучи слишком длинной, достаточно точно отражала назначение документа.</p><p> Описание стиля некоторых элементов Web-страницы. В файле Strukt.htm назна чены шрифты для элементов Н2 и CODE. На рис. 2.1 видно, как изменится вид заго ловка второго уровня после такого переопределения. Естественно, что для каждого элемента существует стилевое оформление по умолчанию, поэтому употребление элемента STYLE не обязательно, но желательно.</p><p> Заголовок Заголовок Заголовок Рис. 2.1. Заголовки, создаваемые при помощи элементов Шрифт второго заголовка переопределен Web-страницы Интересно, как синтаксис HTML отражает историю развития вычислительной техники. Например, старый, теперь уже не работающий элемент BLINK напомина ет нам о тех временах, когда люди использовали дисплеи, которые имели (страш но подумать!) только текстовый режим. При таком положении вещей мигание текста (blink) было, наверное, единственным достижимым визуальным эффектом.</p><p> В противоположность этому, элемент STYLE, введенный сравнительно недавно, вызывает ассоциации с программами для Windows, так как в них впервые появи лось стилевое оформление текста, которое теперь невероятно популярно, и без него уже немыслима работа в таких приложениях, как Word или Excel.</p><p> <МЕТА> Этот элемент содержит служебную информацию, которая не отражается при про смотре Web-страницы. Внутри него нет текста в обычном понимании, поэтому нет и конечного тега. Каждый элемент МЕТА содержит два основных атрибута, пер вый из которых определяет тип данных, а второй — содержание. Вот несколько примеров • Дата, обозначающая «срок годности» документа:</p><p> • Адрес электронной почты:</p><p> т Имя автора Web-страницы:</p><p> паше автора" • Набор ключевых слов для поиска:</p><p> • Краткое описание содержания Web-страницы:</p><p> страницы" • Описание типа и характеристик Web-страницы:</p><p> страницы" • Указание приложения, в котором была создана Web-страница:</p><p> HTML-редактора" Здесь и далее при описании элементов и их атрибутов курсивом выделены фраг менты, которые должны быть заполнены пользователем по его усмотрению. Ат рибут name используется приложением-клиентом для получения дополнительной информации о Web-страницах и их упорядочения. Этот атрибут часто заменяют атрибутом Он используется сервером для создания дополнительных полей при выполнении запроса.</p><p> Кроме этого, элемент МЕТА может содержать URL. Шаблон соответствующего ат рибута таков:</p><p> 40 _ Глава 2. Синтаксис <BODY> Этот элемент заключает в себе гипертекст, который определяет собственно Web страницу. Это та часть документа, которую разрабатывает авто страницы и которая отображается броузером. Соответственно, конечный тег этс го элемента надо искать в конце HTML-файла. Внутри элемента BODY можно пользовать все элементы, предназначенные для дизайна Web-страницы. Внутр начального тега элемента BODY можно ряд атрибутов, установки для всей страницы целиком. Рассмотрим их по порядку.</p><p> Один из самых полезных Для дизайна — атрибут, определяющий фон появление можно уподобить маленькой революции в WWW, так как одина серые Web-страницы вдруг расцвели яркими цветными узорами:</p><p> к файлу фона" Более простое оформление фона сводится к заданию его цвета:</p><p> Цвет фона задается тремя двуразрядными числами, кото определяют интенсивность красного, зеленого и синего цветов соответствен но. Более подробно о задании цветов будет рассказано ниже.</p><p> Оба приведенных выше атрибута не являются альтернативными и часто исполь совместно: если по каким-либо причинам не может быть найден фона, используется цвет.</p><p> Поскольку фон страницы может изменяться, необходимо иметь возможност] подбирать соответствующий цвет текста. Для этого имеется следующий атрибут Для задания цвета текста гиперссылок используется следующий атрибут:</p><p> Точно так же можно задать цвет для просмотренных гиперссылок:</p><p> Можно также указать изменение цвета для последней выбранной гиперссылки:</p><p> Гипертекст, расположенный внутри элемента BODY, может иметь произвольную структуру. Ее определяют, в первую очередь, назначение Web-страницы и фанта зия разработчика.</p><p> <Hlx/hl> Элемент заголовка. Существует шесть уровней заголовков, которые обозначают ся Н1...Н6. Заголовок уровня 1 самый крупный, а уровень 6 обеспечивает самый маленький заголовок. Рис. 2.1 дает представление об относительных размерах букв в заголовках. Для заголовков можно использовать атрибут, задающий вырав нивание влево, по центру или вправо:</p><p> <HR> Горизонтальная линия (horizontal rule) — очень часто используемый элемент.</p><p> Во-первых, потому что с его помощью очень удобно делить страницу на части.</p><p> Во-вторых, потому что выбор подобных элементов оформления у автора страни цы очень небольшой. Действительно, в HTML практически отсутствуют похожие конструкции, только для горизонтальной линии почему-то было сделано исклю чение. Правда, несмотря на некоторую скупость языка в этой области, можно при думать немало стандартных графических образов, которые разнообразили бы вид страниц.</p><p> Элемент не имеет конечного тега, но допускает ряд атрибутов для выравнивания влево, по центру, вправо, по ширине:</p><p> Можно задавать толщину линии:</p><p> в пикселах Можно управлять длиной пикселах в Можно выбрать цвет:</p><p> 42 Глава 2. Синтаксис HTML HTML-документ может быть очень большим, и в этом случае пользователю дол быть предоставлена возможность быстрого перемещения к нужному раздел документа. Для этого можно использовать механизм гиперссылок. Необходим также в нужных местах текста расставить соответствующие метки.</p><p> гиперссылки обсуждаются в разделе «Гиперссылки» главы 3, а здесь мы рим только шаблон для создания меток:</p><p> <А В этом случае данной строке документа присваивается имя, и, следовательно, другой части документа или даже на другом документе может быть создана ссылка, приводящая в эту точку.</p><p> Например, для перехода внутри документа можно использовать следующую кон <Р>Переход к <А Несколько подобных строк могут образовать своеобразное оглавление Web-стра которое можно разместить в начале и в конце документа.</p><p> <BASE> Элемент для задания базового адреса (URL) для ссылок. Это позволяет опускат] начальную часть адреса в ссылках документа. Для использования этого элемент;</p><p> необходимо использовать следующую конструкцию:</p><p> <BASE Фрагмент адреса является обязательным. При формировании адреса будет отброшен. Так, если в тексте документа встретится ссылка <А текст то она будет соответствовать URL В том случае, когда надо задать базовый адрес для локального диска (например.</p><p> должна быть использована такая конструкция:</p><p> <BASE Тогда при указании относительной ссылки можно будет задавать не только имя файла, но и имена папок, в которых он находится. Иными словами, путь к файлам может быть разбит на две части: абсолютную и относительную. Это полезно в том случае, когда для файлов, указанных в документе, есть общий начальный фраг мент пути.</p><p> В выражении абсолютной ссылки можно также опустить указание на схему до ступа //). В этом случае будет учитываться только левая часть абсолютной ссылки до первого левого символа то есть имя локального диска.</p><p> Правила синтаксиса Правила синтаксиса Теперь, когда мы знаем, как выглядит код Web-страницы, можно сделать некото рые обобщающие выводы относительно синтаксиса HTML. При использовании каждого элемента важно знать, какие элементы могут располагаться внутри него и внутри каких элементов может находиться он сам. Так, взаимное расположение элементов HTML, HEAD, TITLE и BODY должно быть стандартным на любой странице, правда, в тех случаях, когда не используются фреймы. Если же страница представ ляет собой документ планировки фреймов (подробнее об этом в разделе «Фрей мы» главы 3), то вместо элемента BODY используется элемент FRAMESET.</p><p> Существуют группы элементов, которые используются совместно. К ним отно сятся элементы для создания таблиц, списков, фреймов. В этом случае порядок вложения элементов определяется логикой создания того или иного объекта на странице: тут надо помнить несложные правила конструирования. Таблицы и фреймы часто используются для того, чтобы разместить детали страницы (рисун ки, текст и т. д.) в определенном порядке. Например, располагая рисунок внутри ячейки таблицы, можно добиться определенного его положения. В таких случаях вложенность элементов определяется разработчиком Web-страницы, и многое зависит от его фантазии и умения.</p><p> Большое количество элементов, которые используются для форматирования тек ста, допускают самые разнообразные варианты вложения. И сами они обязатель но должны располагаться внутри определенных элементов. Здесь надо руковод ствоваться здравым смыслом: каждый элемент выполняет заданную функцию и имеет определенную область действия.</p><p> В приведенном ниже примере есть два абзаца (первый в зеленой рамке) и таблица:</p><p> <Р Зрх solid абзаца 1</р> <TABLE> </table> <Р> Текст абзаца 2</р> Таблица в случае — независимый элемент. Ее можно, например, выравни вать независимо от остального текста.</p><p> Можно использовать другой код:</p><p> <Р Зрх solid абзаца <TABLE> </table> <Р> Текст абзаца 2</р> Исчез конечный тег первого абзаца. Теперь таблица является частью первого абзаца, и зеленая рамка будет охватывать таблицу и текст.</p><p> И наоборот, элемент Р может находиться внутри таблицы: например, один эле мент ячейки TD может содержать несколько абзацев Р.</p><p> Нарушение правил вложения — одна из наиболее распространенных ошибок при создании Web-страниц. Чтобы избежать таких ошибок, надо пользоваться редак торами гипертекста, которые автоматически контролируют выполнение правил 44 2. Синтаксис HTML синтаксиса. Ниже приведена строка, содержащая типичную ошибку элементов:</p><p> <Н1>Заголовок 1 <Н2> Заголовок 2 </h1> Заголовок 3 </h2> Надо заметить, что броузеры построены таким образом, что они «стараются» реагировать на ошибки разметки гипертекста. Если страница может быть жена, то она выводится на экран без каких-либо предупреждающих сообщений Программа интерпретирует ошибочно расставленные теги определенным и формирует изображение, следуя логике, заложенной в нее разработчиками.</p><p> этом вид страницы может и не соответствовать замыслу автора. И только в очень серьезных ошибок или явных противоречий броузер выводит сообщение с невозможности отобразить страницу. Косвенным признаком ошибки может служить появление на странице фрагментов кода HTML. Пользователи много работающие с Интернетом, наверняка сталкивались с такой ситуацией.</p><p> Правила синтаксиса распространяются и на использование стартового и ного тегов, атрибутов и содержимого элемента. Не путайте понятия «элемент» «тег». — это контейнер, содержащий атрибуты внутри стартового тега к полезную информацию между стартовым и конечным тегами. Тег — это конструк ция, заключенная в угловые скобки и используемая для обозначения области дей ствия элемента.</p><p> Некоторые элементы не имеют конечного тега. Очевидно, что элементу BR, обо значающему конец строки, не нужен конечный тег. Некоторые элементы могут использоваться с конечным тегом или без него. Самым ярким примером служит элемент абзаца Р. Он может иметь конечный тег, но если этот тег не задан, то при знаком окончания действия элемента служит следующий элемент, который мо жет логически определить конец текущего абзаца: другой элемент Р, элемент ри сунка элемент списка UL, элемент таблицы TABLE и т. д.</p><p> Таким образом, полезная информация одного элемента должна находиться или между начальным и конечным тегами данного элемента, или между начальным тегом данного и начальным тегом следующего элемента. Любой произвольный текст, введенный на страницу, воспринимается броузером как подлежащий выво ду на экран и, следовательно, форматированию в соответствии с окружающими этот текст элементами. При этом не учитывается разбиение текста на строки, по лученное в текстовом редакторе. всю Web-страницу можно умес тить в одной длинной строке. Символы конца строки, введенные, например, в Блокноте, могут помочь чтению кода HTML, но не отображаются броузером.</p><p> Последний, при выводе страницы на экран, может оборвать строку в соответствии с расстановкой элементов Hn, P или BR, а в остальных случаях он форматирует абзацы произвольно, в зависимости от объема текста, размера шрифта и текущего разме ра окна. Поэтому Web-страницы надо компоновать таким способом, чтобы их вид кардинально не изменялся для разных режимов монитора, размера экрана, размера окна броузера, а также для полноэкранного или оконного режимов.</p><p> Очень важным правилом, которое не имеет исключений, является размещение атрибутов элемента внутри начального тега.</p><p> Кодирование символов Кодирование символов Я думаю, нет нужды доказывать, что основным языком Интернета является анг лийский. В то же время для гипертекстовых документов предусмотрено исполь зование национальных алфавитов. Стандартным режимом отображения являет ся кодировка ISO Latin (ISO 8859-1). Она подходит как для MS-DOS (набор символов ASCCII), так и для Windows, поэтому набор программ для просмотра и редактирования кода HTML, широк. В то же время броузеры поддер живают набор символов Unicode 2.0 что позволяет использовать на циональные алфавиты. С практической точки зрения это означает, что символы могут кодироваться однобайтовым числом (коды в пределах 0-255) или двубай товым (0-65 535). В первом случае для алфавита необходим атрибут charset (см. листинг 1.1), так как одни и те же коды символов могут быть интерпретированы по-разному для различных кодовых страниц, А как если атрибут не указан? в MSIE подменю Вид коди ровки меню Вид и проверьте, какие кодовые страницы доступны на вашем ком пьютере. Наверняка вы найдете команды, отвечающие за отображение русских букв: Кириллица (Windows) и/или Кириллица (КОИ8-Р). Это две наиболее популяр ные в нашей стране кодировки. Самый простой вариант, когда для Web-страницы не указана ни кодовая страница, ни конкретные шрифты. Тогда броузер будет использовать шрифты, по Поскольку каждый пользова тель настраивает программу для себя и применяет шрифты с национальными ал фавитами, то с отображением отечественных ресурсов проблем обычно не возни кает. Русский будет читать русские, а немец — немецкие тексты. Если страница загружается из Интернета, то проблема тоже может быть решена: броузер анали зирует текст страницы и пытается подобрать необходимую кодировку. Если он делает это пользователь всегда может применить упомянутую выше команду и исправить положение.</p><p> Если в документе есть указание на определенную кодовую страницу, выбор шрифта (в данном случае — некоторого подмножества символов, которые будут служить для отображения кодов 128-255) будет предопределен. Коды 32-127, то есть знаки препинания, цифры и буквы латинского алфавита, отображаются в по давляющем большинстве случаев правильно, а коды 128-255 могут отображаться по-разному. Обычно программы поддерживают большое число национальных алфавитов. Во время инсталляции программного обеспечения автоматически устанавливаются и необходимые для этого шрифты.</p><p> Проблема чаще всего возникает, если кодовая страница указана неправильно. Напри мер, при создании гипертекстовых документов в MS Word или MS FrontPage Express в текст страницы автоматически добавляется конструкция типа которая не позволяет использовать кириллицу. В этом случае необходимо правиль но указать значение атрибута: (или другое, если вам нужна другая кодовая страница). Если вы посмотрите «фирменные» русские сайты в Интернете, то обнаружите, что большинство переключателей кодировки предла гают два варианта использования кириллицы: Windows и КОИ-8.</p><p> Глава 2. Синтаксис HTML Почему же возникают такие сложности, когда существует система Unicode? От вет прост: из-за стремления разработчиков обеспечить себе комфортные работы. Действительно, все стандартные программы рассчитаны на представление символов. А редактировать код HTML удобнее всего, просто ввод;</p><p> символы с клавиатуры. Если же документ использует кодировку Unicode, то работы с ним не подойдут такие средства, как Блокнот, Norton Commander WordPad, и придется остановиться на гипертекстовом редакторе. В этом русская буква А будет выглядеть в режиме «источника» так: (в кодировке). Такую страницу будет сложно читать и редактировать. Вы может< столкнуться с подобной кодировкой, если будете набирать кириллицу в гипертекстовом редакторе. Он может выполнить преобразование символов. Поэтому каждый новый редактор надо тестировать возможность использования русских букв: набрать небольшой текст, документ, а затем просмотреть в режиме источника.</p><p> Использование спецсимволов В HTML и, соответственно, в броузерах реализована прорисовки символов по их кодам. Символы могут быть общепринятыми, вводимыми с кла виатуры, нестандартными и используемыми в HTML в качестве служебных. Все их будем называть спецсимволами. Первый способ ввода спецсимвола заключает ся в указании его кода. Например, латинскую букву А можно задать так: Для некоторых символов предусмотрена мнемоническая кодировка. В табл. 2.1 приве ден набор часто используемых спецсимволов (по стандарту ISO 8859-1). Для от деления кода символа от последующего текста надо вводить точку с запятой.</p><p> Таблица 2.1. Спецсимволы Код Числовой Мнемонический Название Символ символа код код 34 &quot;</p><p> Прямая кавычка 38 Амперсанд & &lt;</p><p> 60 Знак «меньше» < 62 Знак «больше» > 153 Торговая марка 160 </p><p> Неразрывный пробел 162 Цент 163 Фунт 164 &curren;</p><p> Знак валюты И 165 Йена 166 Вертикальная черта Знак параграфа § 169 &copy;</p><p> Знак копирайта © Кодирование символов Код Числовой Мнемонический Название Символ символа код код 171 Левая типографская кавычка 172 Знак отрицания 174 Знак «зарегистрировано» ® о 176 Знак градуса 177 Знак «плюс минус» 178 &sup2;</p><p> Степень 179 Степень 181 Знак 182 Знак абзаца 183 Точка-маркер 185 &sup1;</p><p> Степень Правая типографская кавычка 188 &frac14;</p><p> Одна четвертая &frac12;</p><p> Одна вторая Знак умножения (крестик) 215 X Знак деления Зачастую мнемонические коды символов бывают очень полезны: особенно для тех символов, которые нельзя ввести с клавиатуры. Например, для указания раз решения экрана можно использовать такую конструкцию:</p><p> Двойная кавычка, угловые скобки и <, >, &) являются служебными в HTML. Если их надо использовать в обычном тексте на Web-странице, то они должны быть указаны только при помощи кодов.</p><p> Интересно, что кириллица тоже может быть реализована в виде набора спецсимво лов. Русские буквы расположены (при кодировании в том месте кодовой таблицы, где первоначально располагались латинские буквы с тильдами, умляутами и т. д. Поэтому англоязычные редакторы HTML при переключении клавиатурного регистра часто записывают кириллицу в виде кодов. Эта особен ность в разделе PRO 5.0» главы 8.</p><p> Таблицы спецсимволов расположены в файле Spec.htm на прилагаемой дискете.</p><p> Вы можете проделать эксперимент с этим файлом. Создайте его копию и удалите из текста указание на кодовую страницу Затем откройте страницу в броузере и посмотрите, как изменятся образцы символов. Например, вместо русских могут появиться символы европейских алфавитов (буквы с тильда ми, умляутами и т. д.). Может измениться и вид кириллицы, набранной при помо щи мнемокодов. Изменив вид кодировки в броузере, можно увидеть самые разные буквы. Если же вид некоторых спецсимволов не от выбранной кодиров ки, то эти символы можно с уверенностью использовать в своих Web-страницах.</p><p> 48 2. Синтаксис Типы данных Выше упоминалось, что основным типом данных Web-страницы является тек стовый. Существует много элементов, которые являются контейнерами для тек ста или используются для форматирования текста. Числовые и мнемонические коды, обозначающие символы, предваряются знаком &. Таким обра зом, амперсанд и угловые скобки могут быть в текст напрямую, а толь ко при помощи кодов. Текстовые данные, являющиеся значениями атрибутов, заключаются в прямые двойные кавычки.</p><p> Числовые данные требуются только для указания значений атрибутов и записы ваются без кавычек.</p><p> Гиперссылки (координаты переходов) обычно состоят из двух частей: текста под сказки и адреса, который определяет координату перехода. Текст подсказки или заменяющий его рисунок располагается внутри а адрес задается при помощи атрибута Гиперссылка обычно выделяется фоне обычного текста цветом или Кроме того, вид указателя мыши обязательно когда пользователь помещает его гиперссылкой.</p><p> На Web-страницах используются и другие формы ссылок. Так, графические дан ные хранятся в отдельных файлах, и для места расположения этих фай лов служит элемент с атрибутом Для указания Web-страниц, размещае мых внутри фреймов, служит FRAME с атрибутом src.</p><p> Существуют правила для определения размеров элементов. Размер, заданный обычным числом, выражается в пикселах. Так, например, задается длина горизон тальной линии в 100 пикселов:</p><p> <HR Горизонтальный размер может быть задан и в процентном к ширине окна броузера:</p><p> <HR Если размер окна будет изменен, то изменится и длина горизонтальной линии.</p><p> Символ * может использоваться для разделения пространства страницы в опреде ленных пропорциях. Ниже показаны два способа определения фреймов (атрибут cols создает фреймы с вертикальным делением), причем левый фрейм в данном случае всегда будет в три раза уже, нежели правый.</p><p> Управление цветом Кодирование используется для раскрашивания шрифтов, горизонтальных линий и фона, других элементов страницы. Цвета обозначаются английскими названиями или числовыми кодами. Существует несколь Управление цветом ко атрибутов, которых являются параметры цвета. Самый простой способ определить цвет — название цвета на английском языке.</p><p> например, задается красный шрифта в элементе FONT:</p><p> В табл. 2.2. все названия цветов. Но в общем случае цвет определяется так шаблоны которого уже упомина лись выше. Любой представляется в случае как комбинация красного (R), зеленого (G) и синего взятых в пропорциях.</p><p> Таблица 2.2. Названия и коды цветов Русское название Английское RGB-код Аквамарин aqua Белый white Желтый yellow #FFFFOO Зеленый green Золотой gold Индиго indigo Каштановый maroon # Красный red #FFOOOO # Оливковый olive Оранжевый orange Пурпурный purple # Светло-зеленый lime #OOFFOO Серебристый silver ttCOCOCO Серый gray # Сизый teal Синий blue # Ультрамарин navy #EE80EE Фиолетовый violet #FFOOFF fuchsia # Черный black Доля каждой цветовой определяется интенсивностью цвета и вы ражается двуразрядным числом. В десятичном исчислении эти числа соответствуют диапазону от 0 до 255. Легко подсчитать, что комбинируя интенсивности трех базовых цветов, разработчик Web-страницы имеет возмож ность запрограммировать любой из 16 777 216 доступных оттенков. В Windows это соответствует цветовому режиму монитора True Color двоич ное кодирование цвета). Это наилучший на сегодняшний день режим цветопере дачи. Таким он, видимо, останется и в дальнейшем, так как возможности цветово го зрения человека и возможности мониторов в смысле точного воспроизведения 50 Глава 2. Синтаксис HTML цветовых нюансов подходят здесь к своему пределу. Таким образом, пользовате ли и разработчики Web-страниц нисколько не ущемлены в своих «цветовых пра вах» по сравнению с остальным компьютерным Если вы внимательно посмотрите на коды, приведенные в табл. 2.2, то обнаружи те, что для формирования стандартных цветов часто используются или крайние значения интенсивности базового цвета 00 и FF, или среднее значение 80. Многие современные приложения имеют средства для работы с цветом, предоставляя пользователю возможность, выбрав в палитре цвет, увидеть его численные ха рактеристики. И наоборот, задав численные значения получить оттенок.</p><p> Нельзя, правда, сказать, что все подобные программы совместимы между собой в смысле генерации цвета. Создав некоторый цвет в программе и задав его RGB-код в другой, вы не обязательно получите тот же самый оттенок. Цветовые нюансы для Web-страниц лучше всего проверять на самих страницах. В файле Color.htm на прилагаемой дискете приведен пример подбора оранжевого цвета.</p><p> Он труднее всего воспроизводится на компьютере и требует визуального тестиро вания. Подобную страницу можно использовать и для подбора других оттенков.</p><p> Фрагмент HTML-файла для этого приведен ниже:</p><p> <TABLE width=200> <TR> <TD <TD <TD > <TD > <TD > <TD > <TD > <TD > <TD > <TD > <TD > <TD > <TD > <TD > </table> Палитра оформлена в виде таблицы, часть ячеек которой раскрашена при помо щи атрибута задания фона:</p><p> Из листинга видно, что задача подбора нужного оранжевого оттенка сводится к подбору интенсивности зеленой составляющей при максимальном значении красной. Вы можете и сами поэкспериментировать с подобной палитрой. В при ложении А приведены все значения двуразрядных чисел и их десятичные эквиваленты.</p><p> Управление цветом Еще один аспект применения цвета. Выше упоминалось, что элемент HR, создающий горизонтальную линию, допускает ряда атрибутов. С их помощью линию можно превратить в цветной прямоугольник. Вот, например, прямоугольник светло-зеленого цвета, выровненный влево, высотой 20 и шириной 18 пикселов:</p><p> <HR size= Подобные изображения можно использовать для разделения частей страницы или в качестве маркеров списка. Теоретически их можно указывать и в (как деталь, на которой надо щелкать мышью), но это не совсем удобно: элемент HR всегда размещается на отдельной строке.</p><p> Ну, и наконец, осталось привести HTML-код, рисующий радугу на Web-странице:</p><p> <FONT РАДУГА </font> <TABLE border=0 > <TR><TD Ж <TR><TD bgcolor=FFDOOO > <TR><TD >Ж <TR><TD > <TR><TD <TR><TD >C <TRXTD >Ф </table> Можно сделать вывод, что «раскрашивание» Web-страницы — способ при дать ей современный, профессиональный вид. Но в данном случае большое значение имеют не только изобретательность и вкус, но особенно чувство меры. Цветовая проработка Web-страницы является альтернативой использованию многочислен рисунков и позволяет обеспечить более быструю загрузку документа. Так уж повелось, что многие мелкие детали (например, маркеры) представляют собой фай лы формата GIF, и часто приходится долго пока загрузятся все кружочки, квадратики, черточки и другая графическая мелочь. Солидные фирмы могут себе это позволить, так как заинтересованному клиенту не остается другого выхода, как ждать окончания загрузки нужной страницы. Если вы создаете личную страницу, то есть резон сделать ее быстро загружаемой. Иначе ваши потенциальные читатели, не дождавшись прорисовки всех деталей, уйдут «бродить» по другим уголкам Сети.</p><p> Я думаю, не будет большой ошибкой утверждать, что разработчики HTML серь езно просчитались, не включив в язык элементы, позволяющие строить примитив ные графические объекты. Это практически безграничное ноле деятельности для совершенствования гипертекста. Важность графики, поддерживаемой броузером, явно недооценили, а теперь, видимо, слишком наверстывать упущенное, так как признание завоевали другие подходы.</p><p> К сожалению, данный раздел по технологическим соображениям невозможно дополнить цвет ными но такие иллюстрации можно найти в примерах в файле Color.htm на прилагаемой дискете.</p><p> Глава Основные элементы HTML версии проблемой при описании и изучении HTML является определение набо ра атрибутов и их значений, допустимых для каждого из элементов. Очень часто можно столкнуться с ситуацией, когда некий хорошо атрибут не использовался в каком-нибудь элементе, а потом вдруг его использование стало давать эффект при просмотре страницы в броузере. Поддержка тельных атрибутов — скорее дело совершенствования броузеров, а не языка.</p><noindex> <div class="reklama"> <center> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- dissers - kvadr (text2) --> <ins class="adsbygoogle" style="display:inline-block;width:336px;height:280px" data-ad-client="ca-pub-9894471784993021" data-ad-slot="6763398730"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </center> </div> </noindex><p> Например, фирмы Netscape и Microsoft постоянно развивают свои программы.</p><p> Поэтому я рекомендую вам экспериментировать. Если при разработке Web-стра ницы вам потребуется известный атрибут, которого нет в спецификации элемен та, проверьте — а вдруг заработает?</p><p> Заголовок страницы Заголовок Web-страницы представляет собой информацию, заключенную внут ри элемента (секции) HEAD. В разделе «Анатомия главы 2 мы уже познакомились с элементами заголовка, и сейчас их надо обсудить более подробно.</p><p> </title> Элемент TITLE определяет текст, который появляется в заголовке окна броузера во время просмотра страницы. Этот текст не только служит подсказкой, но может использоваться и поисковыми машинами для анализа страниц.</p><p> Существует три способа для поиска страниц в Интернете на основе текстовых данных: по ключевым словам МЕТА, по тексту, размещенному на странице, и по строке заголовка внутри элемента TITLE.</p><p> < STYLE > и <LINK> Элемент STYLE тоже должен располагаться внутри элемента HEAD. Если вы хотите разобраться, какие нестандартные форматы используются на странице, надо про смотреть содержимое этого элемента. В нем будут указаны необходимые форма ты. Если таких форматов нет, значит стили страницы записаны в отдельном фай ле. Ссылка на такой файл должна находиться в элементе LINK. Подробнее о стилях рассказывается ниже в разделе «Таблицы стилей».</p><p> Стандартные атрибуты <МЕТА> Секция заголовка может содержать несколько элементов МЕТА, каждый из кото рых отвечает за определенный набор параметров. Использование элементов МЕТА является обязательным, но настройки могут быть весьма важны.</p><p> Так, например, известно, что броузер в некоторых случаях способен автоматиче ски определить вид кодировки страницы. Пользователь, работая с броузером, может выбрать в меню определенную кодировку. Чтобы исключить ность при просмотре конкретной страницы, на ней целесообразно разместить указание на кодовую страницу. Для документов в кодировке Windows оно долж но быть таким:</p><p> Информация, сосредоточенная в элементах МЕТА, определяет общие настройки Web-страницы и называется профилем. Профили можно хранить в отдельных файлах и к определенной странице при помощи специального ат рибута элемента HEAD:</p><p> <HEAD В секции HEAD могут располагаться элементы, которые имеют отношение ко всей странице Так, если для последней создано звуковое то его параметры определяет элемент BGSOUND (см. ниже раздел «Устаревшие и не стандартные Стандартные атрибуты Существует ряд атрибутов, которые могут использоваться во многих элементах.</p><p> Часть этих атрибутов очень важна для конструирования Web-страниц, а часть подходит только для определенных задач. Атрибут id выполняет функции уникального имени элемента. В зависимости от типа элемента, этот атрибут различные функции (см. раздел «Табли цы стилей» текущей главы и «Элементы форм» главы 4).</p><p> Атрибут classid задает программу или объект, которые могут использоваться в определенных элементах.</p><p> Атрибут style может использоваться со многими элементами. Он предназначен для определения формата конкретного элемента и может принимать самые раз ные значения. Подробно он рассмотрен ниже в разделе «Таблицы стилей».</p><p> Похожие функции выполняет атрибут class. Его можно указывать, если в секции HEAD расположен элемент STYLE или использована ссылка на каскадную таблицу стилей (см. ниже раздел «Таблицы Атрибут align используется для выравнивания текста, объектов или элементов целиком. Выравнивание может выполняться относительно границ окна, рамки 54 3. Основные элементы HTML версии таблицы и т. д. Каждый элемент позволяет указывать определенные значения для этого атрибута. В общем случае значения могут быть такие:</p><p> • — выравнивание по левому краю;</p><p> • right — выравнивание по правому краю;</p><p> • j ustify — выравнивание по ширине (для текста);</p><p> • center — выравнивание по центру (по горизонтали);</p><p> • middle — выравнивание по центру (по вертикали);</p><p> • top — выравнивание по верхней границе;</p><p> • bottom — выравнивание по нижней границе.</p><p> Атрибут определяет, на каком языке набран текст внутри текущего элемента:</p><p> языка" Вот некоторые коды:</p><p> • а г — арабский;</p><p> • de — немецкий;</p><p> • el — греческий;</p><p> • en — английский;</p><p> • en-us — американская версия английского языка;</p><p> • es — испанский;</p><p> • f г — французский;</p><p> • he — иврит;</p><p> • hi — хинди;</p><p> • it — итальянский;</p><p> • — • голландский;</p><p> • pt — португальский;</p><p> • ги — русский;</p><p> • — китайский.</p><p> В некоторых языках применяется обратное привычному направление текста: спра ва налево. При помощи атрибута указать необходимое направление:</p><p> • — слева направо;</p><p> • — справа налево.</p><p> Атрибут теоретически может использоваться в разных элементах, но не все броузеры обеспечивают его работу. Более надежный способ — применение специ ально предусмотренного для подобных случаев элемента BDO (см. ниже).</p><p> Атрибут type определяет тип документа, который указывается в ссылке. Здесь ис пользуются так называемые типы MIME (Multipurpose Internet Mail Extensions).</p><p> Стандартные атрибуты Первоначально они предназначались для определения формата отправлений почты, но сейчас служат для указания форматов документов в составе Web-страниц. Наиболее часто используемые типы:</p><p> • text/plain — обычный текст;</p><p> • text/ess — каскадная таблица стилей;</p><p> • text/html — документ в формате HTML;</p><p> • application/postscript — документ в формате PostScript;</p><p> • pg, — изображения в формате GIF, JPG или PNG соответственно;</p><p> • — видеоролик;</p><p> • application/Java — апплет;</p><p> • — программа (сценарий) на JavaScript;</p><p> • text/vbscript — программа (сценарий) на VBScript.</p><p> Для форм атрибут type имеет другой смысл: тип определенного элемента формы (кнопка, поле ввода и т. д.).</p><p> Атрибут charset необходим там, где надо указать вид кодировки, например:</p><p> Атрибут (long description) может быть полезен в тех случаях, когда для какого-нибудь элемента необходимо использовать описание (комментарий) большого объема. Тогда документ присоединяется при помощи ссылки:</p><p> Атрибут title, наоборот, позволяет создать короткую всплывающую подсказку.</p><p> Она появляется на экране, когда пользователь располагает указатель мыши над элементом. Значение атрибута — произвольная текстовая строка.</p><p> Атрибуты событий Для страницы могут быть определены программы, которые выполняются только в случае определенных действий пользователя. В этом случае запуска надо «привязать» к определенным Например, если надо из менить внешний вид элемента, когда укажет на него мышью (очень модный ныне прием), то для такого элемента должны быть указаны два атрибута:</p><p> Первая программа (сценарий) изменит вид элемента, когда указатель мыши ока жется над ним, а вторая вернет элементу прежний вид, когда указатель мыши бу дет убран. Разные элементы позволяют использовать разные события.</p><p> События, связанные с мышью:</p><p> • onclick — щелчок мышью на элементе;</p><p> • ondblclick — двойной щелчок мышью на элементе;</p><p> 56 Глава 3. Основные элементы HTML версии • — кнопка мыши нажата;</p><p> • up — кнопка мыши отпущена;</p><p> • onmousemove — указатель мыши в область элемента;</p><p> • — указатель мыши расположен над элементом;</p><p> • — указатель мыши перемещен за границы области элемента.</p><p> События, связанные с выбором элементов и редактированием форм:</p><p> • onfocus — элемент выбран (получен фокус);</p><p> • onselect — часть текста внутри элемента выделена;</p><p> • onchange — данные в элементе были изменены;</p><p> • — элемент перестал быть выбранным (потерян фокус).</p><p> События, связанные с клавиатурой:</p><p> • — клавиша нажата;</p><p> • onkeyup — клавиша отпущена;</p><p> • onkeypress — клавиша нажата и отпущена.</p><p> Форматирование текста Текст — единственный объект Web-страницы, который не требует специального определения. Иными словами, произвольные символы интерпретируются по умолчанию как текстовые данные. Но для форматирования текста существует большое количество элементов. Большинство из них, кроме специальных, поддер живает стандартные атрибуты: id, class, title, style и атрибуты событий.</p><p> Изначально в HTML было введено меньше возможностей для форматирования текста, чем в обычные текстовые редакторы. В результате авторам гипертексто вых документов приходилось прибегать к различным ухищрениям, чтобы при дать тексту заданный вид. Сейчас положение но все дополнительные возможности осуществляются за счет применения таблиц стилей. Например, только с помощью свойства text-indent можно задать величину отступа первой строки абзаца.</p><p> Форматировать текст можно и с помощью традиционных элементов: выделять фрагменты курсивом, полужирным, выбирать шрифт и т. д. Рассмотрим эти эле менты. Для них могут быть использованы стандартные атрибуты id, class, title, style, атрибуты событий, а также атрибуты, определяющие уникаль ные свойства определенных элементов.</p><p> Элемент абзаца (paragraph) — один из самых полезных. Он позволяет использо вать только начальный тег, так как следующий элемент Р обозначает не только начало следующего абзаца, но и конец предыдущего. В тех случаях, когда по Форматирование лу необходимо обозначить завершение абзаца, можно использовать и конечный тег. В некоторых случаях начальный тег удобно ставить в конце строки: он не только обозначит конец абзаца, но и выполнит функцию тега <BR> (разрыв строки).</p><p> Например:</p><p> первого <Р>Текст Текст третьего Вместе с элементом абзаца можно использовать атрибут выравнивания align:</p><p> • — выравнивание по левому краю;</p><p> • - выравнивание по центру;</p><p> • right" — выравнивание по правому краю.</p><p> Для центрирования абзаца следует использовать такую конструкцию:</p><p> <Р Текст абзаца Абзацы форматируются броузером, и их вид зависит, в частности, от размера окна программы. Три следующих элемента позволяют внести некоторую опреде ленность в формат абзаца.</p><p> <BR> Элемент, обеспечивающий принудительный переход на новую строку. Он имеет только начальный тег. В месте его размещения строка заканчивается, а оставший ся текст печатается с новой строки.</p><p> Атрибут clear позволяет выравнивать объекты (например, рисунки) относитель но текста, в котором использован элемент BR. Если элемент объекта содержит ат рибут align, то в расположенных рядом элементах BR должен присутствовать ат рибут например:</p><p> <BR Значения атрибута:</p><p> • попе — значение по умолчанию;</p><p> • — если объект выровнен влево;</p><p> • right — если объект выровнен вправо;</p><p> • all — для объекта, который может быть выровнен по любому краю.</p><p> Стандартные атрибуты: id, class, title, style.</p><p> <NOBR> </nobr> Этот элемент по своему действию является прямой противоположностью преды дущего. Текст, заключенный между его тегами, будет выведен в одну строку. Если длинная строка не уместится на экране, для ее просмотра придется использовать горизонтальную полосу прокрутки.</p><p> 58 _ Глава 3. Основные элементы версии <PRE> </pre> Элемент для обозначения текста, отформатированного заранее (preformatted).</p><p> Подразумевается, что текст будет выведен в том виде, в котором был подготовлен автором. Например, учитываются символы конца строки, появившиеся при набо ре текста в редакторе. Во всех других случаях броузер игнорирует эти символы.</p><p> Возможен и обратный эффект: если пользователь введет текст как одну длинную строку, то она не будет разорвана броузером, а уйдет за край окна программы.</p><p> В этом смысле элемент работает так же, как элемент NOBR. По умолчанию для отформатированного заранее текста выбирается моноширинный шрифт. Этот элемент удобно использовать для показа листингов программ или для вывода текстовых документов, переформатирование которых может привести к искаже нию их смысла.</p><p> Элемент PRE позволяет набрать текст с использованием специальных символов форматирования, таких как «line feed» или «carriage return» (см. табл. 3.1 ниже).</p><p> Теоретически можно представить ситуацию, когда разработчику Web-страницы потребуется показать, как создавали линии таблиц в далеком прошлом, когда тек стовый режим уже существовал, а символы псевдографики еще не были изобрете ны. В ход шли плюсы, восклицательные знаки и тире. В этом случае элемент PRE также окажется незаменим, хотя я не рекомендую поддаваться ностальгическим порывам: лучше сделать черно-белый рисунок формата GIF.</p><p> Для этого элемента определен специальный атрибут, который позволяет задать ширину блока текста в символах:</p><p> Этот атрибут не поддерживается броузерами. Стандартные атрибуты:</p><p> id, class, title, style, атрибуты событий.</p><p> <CENTER> Элемент для центрирования текста, а точнее — любого содержимого. Этот элемент не является общеупотребительным. В тех случаях, когда это возможно, вместо пего в элементах текста используют атрибут Выделение текста полужирным шрифтом. Очень популярный элемент. Исполь зование полужирного шрифта — прием, позаимствованный из текстовых редак торов.</p><p> <BIG> Увеличение размера шрифта.</p><p> </small> Уменьшение размера шрифта.</p><p> Форматирование текста _ Выделение текста курсивом.</p><p> </strike> или <S> </s> Зачеркнутое начертание текста. В настоящее время элемент заменяют бо лее простым в написании элементом S.</p><p> Подчеркнутое начертание текста.</p><p> </sub> Элемент, создающий эффект нижнего индекса (subscript).</p><p> <SUP> </sup> Элемент, создающий эффект верхнего индекса (superscript).</p><p> Действие двух последних элементов иллюстрирует фрагмент файла гипертекста Text.htm, показанный на рис. 3.1. Оба этих элемента обеспечивают уменьшение размера шрифта. Поэтому их можно использовать и для форматирования абзаца целиком, если надо, чтобы он был выведен мелким шрифтом.</p><p> Обычный текст и И SUP Рис. 3.1. Использование элементов SUB и SUP Элемент, обозначающий текст телетайпа (teletype). Его особенность заключается в том, что он обеспечивает использование моноширинного шрифта.</p><p> <INS> </ins> и <DEL> </del> Эти элементы позволяют выделить текст, который надо обозначить как вставлен ный (элемент INS) или удаленный (элемент DEL). Визуально вставленный текст выделяется подчеркиванием, а удаленный — зачеркиванием.</p><p> Для указания источника изменений, то есть для документа, в котором находится данный фрагмент либо дано объяснение, почему в тексте появилась такая вставка, может быть использован атрибут:</p><p> 60 _ Глава 3. Основные элементы HTML версии Для даты изменения тоже предусмотрен атрибут:</p><p> В результате начальный тег может иметь такой вид:</p><p> <BASEFONT> Элемент, определяющий базовый (основной для всей размер шрифта.</p><p> Внутри элемента необходимо указать атрибут:</p><p> размер шрифта Величина для этого атрибута может лежать в пределах от 1 до 7. По умолчанию используется величина 3. Установка, выполняемая этим элементом, имеет значе ние для элемента FONT (см. ниже), который позволяет задавать относительный раз мер шрифта. Другие атрибуты у этого элемента такие же, как и у элемента FONT.</p><p> <FONT> </font> Определение типа, размера и цвета шрифта. Все эти характеристики определяют ся при помощи соответствующих атрибутов. Абсолютный размер шрифта задает ся атрибутом size (размер):</p><p> размер шрифта Этот атрибут может принимать значения от 1 до 7. На рис. 3.2 показаны несколь ко образцов надписей, выполненных шрифтами разного размера.</p><p> Шрифт 7 Шрифт Шрифт 5 Шрифт 4 3 Рис. 3.2. Возможные варианты размеров шрифта Размер шрифта может также задаваться относительно базового:</p><p> При назначении величины для этого атрибута надо учитывать величину базового размера. В сумме эти две величины должны соответствовать одному из абсолют ных размеров. Так, для базового размера, равного 3, относительный размер может находиться в пределах от -2 до +4. Если величина выходит за допустимый пре дел, то используется либо шрифт размера 7, либо шрифт размера 1. На рис. 3.3 пока заны надписи, выполненные шрифтами с заданным размером.</p><p> Для элемента FONT можно использовать атрибут цвета:</p><p> Форматирование + Рис. 3.3. При помощи относительных величин тоже можно получить семь градаций размера шрифта Атрибут позволяет задавать определенный шрифт или несколько шриф тов (через точку с запятой), например:</p><p> Verdana;</p><p> Правда, есть одна проблема. Web-страницы просматривает множество людей и нет гарантии, что у каждого из них окажется нужный шрифт. Если в системе не установлен шрифт точно с таким же названием, то броузер использует стандарт ный шрифт из числа назначенных по умолчанию: один пропорциональный, дру гой моноширинный.</p><p> Элемент FONT может с успехом заменять элементы заголовка Н1...Н6. Для послед них, например, не предусмотрено задание цвета букв. Чтобы создан ный на основе элемента FONT, хорошо смотрелся, этот элемент необходимо комби нировать с другими: CENTER, В, I, P и т. д.</p><p> Дополнительные атрибуты: class, title, style.</p><p> <BDO> </bdo> Этот элемент позволяет изменять направление текста. Он используется совмест но с атрибутом которому может быть присвоено одно из значений: LTR (слева направо) или RTL (справа налево). Например:</p><p> <BDO текста можно переносы...</p><p> В табл. 3.1 приведены коды некоторых, по большей части невидимых в обычном режиме просмотра, символов. Ряд символов (таких как «line feed» или «carriage return») используется в текстовых редакторах для форматирования текста, а пользователь их не видит. Такие символы можно указывать внутри элемента PRE, где они будут выполнять свою функцию.</p><p> В тексте могут быть использованы символы мягкого переноса. Они показывают, где может быть закончена строка, но такие символы не учитываются при выпол нении операций поиска и сортировки. Если в месте расположения мягкого пере носа строка не заканчивается, символ переноса виден не будет. Это отличает мяг кий перенос от обычного дефиса, который виден всегда.</p><p> Интересен и символ пробела нулевой длины. Такие символы используются для скрытого разделения слов.</p><p> Глава 3. Основные элементы HTML версии Таблица 3.1. Коды символов Код Числовой код (HTML) Название Табулятор Конец строки (line feed) 12 №2 Конец страницы (form feed) Возврат каретки (carriage return) Пробел Дефис 160 Неразрывный пробел 173. &#173 Мягкий перенос 8203 Пробел нулевой ширины CU A U С Примеры форматирования текста записаны в файл который можно найти на прила гаемой дискете.</p><p> Элементы содержания Существует большая группа элементов, которые используются не столько для фор матирования текста, сколько для выделения смысла абзацев и слов. Поскольку для таких элементов не определены заранее эффекты форматирования, разные програм мы могут по-разному воспроизводить текст, заключенный внутри этих элементов.</p><p> <ЕМ> </ет> и <DFN> </dfn> Элементы, обозначающие выразительность (emphasis) данного фрагмента текста и определение чего-либо (definition). Оба элемента аналогичны по своему элементу I, то есть в большинстве случаев позволяют выделить текст курсивом.</p><p> С точки зрения дизайна документа эти элементы ничем особенным не отличают ся. Они могут пригодиться только для того, чтобы единообразно выделить оди наковые по назначению (или смыслу) фрагменты текста, находящиеся в разных частях документа или даже на разных страницах. Разработчик, в этом случае, не может точно знать, какой именно шрифт будет использован: это определяется каждым броузером по-своему. Но он может быть что все фрагменты тек ста будут отформатированы одинаково. В языке можно найти еще несколько эле ментов, которым можно дать такую же характеристику.</p><p> Эти и другие элементы содержания могут иметь стандартные атрибуты: id, class, title, style, атрибуты событий.</p><p> <BLOCKQUOTE> </blockquote> Обозначение цитаты. Этот элемент требует наличия конечного тега. Текст не пре терпевает никаких но абзац располагается с отступом. К кавычкам этот Элементы содержания _ элемент тоже не имеет никакого отношения: если в цитате имеются кавычки, они должны быть проставлены явным образом. Визуально форматирование этим эле ментом заключается только в отступе слева, поэтому элемент может быть исполь зован в самых разных случаях.</p><p> Этот элемент имеет собственный нестандартный атрибут, который позволяет указать источник цитирования:</p><p> документа-первоисточника" Предполагается, что адрес задается в виде URL.</p><p> Элемент, похожий на предыдущий. Но если BLOCKQUOTE позволяет создать отдель ный абзац с отступом, то используется для выделения цитаты внутри абзаца (или строки).</p><p> Предполагается, что этот элемент может быть использован для форматирования цитат и ссылок в обычном понимании этого слова. Текст, расположенный внутри этого элемента, печатается по умолчанию курсивом.</p><p> </address> Этот элемент подобен элементу CITE и отличается только предусмотренным со держанием. Он также обеспечивает форматирование курсивом. В некоторых справочных можно встретить информацию о том, что данный эле мент поддерживает атрибут align. Легко убедиться, что это не так.</p><p> Вообще, к подобным элементам надо относиться с определенной долей недоверия.</p><p> Я имею в виду элементы, предназначенные для размещения определенной инфор мации, а не для создания эффектов форматирования. Мы уже рассмотрели эле менты ADDRESS и CITE, а элементы CODE, KBD, SAMP и VAR рассматриваются ниже. Дело в том, что они не относятся к основному направлению совершенствования HTML и пользовательских агентов. Поэтому броузеры интерпретируют их по-разному и не в обязательном порядке. Другое дело, если стиль для этих элементов определен в самой Web-странице.</p><p> <STRONG> </strong> Элемент, отвечающий за выделение текста. Обычно его применение равносильно использованию элемента В для выделения текста полужирным начертанием.</p><p> <CODE> </code>, <SAMP> </samp> и <VAR> </var> Элементы, предназначенные для вывода фрагментов программ. CODE использует ся для форматирования текста программы. SAMP предполагается задействовать 64 Глава 3. Основные элементы HTML версии при иллюстрации примеров (sample) вывода данных на экран. VAR был создан для выделения переменных (variable). Как правило, все эти элементы обеспечивают вывод моноширинного шрифта.</p><p> <KBD> </kbd> Этот элемент предназначен для выделения текста, который пользователь должен ввести с клавиатуры (keyboard). Можно рассчитывать, что текст, выделенный с помощью этого элемента, будет выведен шрифтом в ном начертании.</p><p> Элемент для обозначения аббревиатур, например: HTML, WWW.</p><p> > Этот элемент можно использовать для выделения акронимов (сокращений, зованных несколькими словами), например: и т. д.;</p><p> и т. п.</p><p> ПРИМЕЧАНИЕ Примеры элементов содержания находятся в файле на прилагаемой дискете.</p><p> Таблицы стилей Таблицы стилей (style sheets) являются одним из самых эффективных ний HTML 4. Они позволяют изменять свойства элементов в соответствии с ланиями разработчика страницы.</p><p> К обычным таблицам таблицы стилей не имеют никакого отношения. В случае шаблон таблицы стилей выглядит так:</p><p> Элемент. имя_стиля значение;</p><p> свойство2: значение;</p><p>... } В результате для определенного элемента задается набор свойств которых весьма значителен). Тем самым снимаются ограничения HTML, а дизайнера (автора открывается широкое поле деятельности.</p><p> Одна из важнейших особенностей стилевого оформления заключается в том, преобразованию подвергаются все элементы, заключенные внутри элемента с стилем. Так, определив некоторый для элемента BODY, вы его всему содержимому Web-страницы. По аналогии с языками программирования это качество называется В соответствии с правилами HTML, автор, использующий стили, должен чить в заголовок документа (элемент HEAD) соответствующее мета-определение:</p><p> Таблицы стилей Броузер получит информацию, какой язык определения стилей использован.</p><p> в данном случае означает «каскадная таблица стилей» (Cascading Style Sheets). Это одновременно стандарт и язык, расширяющий традиционный HTML.</p><p> В настоящее время существует две спецификации (CSS1 и CSS2), в которых пе речислены свойства элементов. Эти свойства очень похожи на атрибуты, но два различия: свойств намного больше и правила синтаксиса несколько другие.</p><p> свойств приведен в приложении Б.</p><p> Надо отметить, что есть еще один способ определения свойств элементов: при помощи языка (например, JavaScript). В этом случае правила синтаксиса свои, хотя суть остается прежней. Этот вопрос обсуждается в главе 5.</p><p> Простейшим способом определения стиля является задание его непосредственно для выбранного элемента, например:</p><p> <Р 10pt;</p><p> font-style: italic;</p><p> color:</p><p> Здесь для абзаца выбран размер шрифта, курсив и синий цвет букв. В отличие от атрибутов имя свойства и значение разделяется двоеточием, а свойства отделяют ся друг от друга точкой с запятой. Для переопределения свойств элемента исполь зован стандартный атрибут style, который может указываться со многими эле ментами.</p><p> Если атрибут style позволяет задать свойства одного элемента, то элемент STYLE определяет свойства всех одноименных элементов, например:</p><p> <STYLE Н1 1;</p><p> border: groove;</p><p> text-align: center;</p><p> color:</p><p> H2 maroon;</p><p> font-style:</p><p> CODE Verdana;</p><p> background:</p><p> P 10;</p><p> color: green;</p><p> font-size:</p><p> P CODE bold;</p><p> col or: violet;</p><p> font-size:</p><p> </style> В этом случае для всей страницы создаются новые стили для заголовков первого и второго уровня. Для элементов CODE выбирается шрифт и цвет фона. Для абзацев (Р) выбирается величина отступа строки, цвет и размер букв. Этот простой пример показывает преимущества стилей: автор страницы может легко создать эффекты, недоступные при использовании только одних атрибутов.</p><p> Последним в нашем примере идет стиль для вложенных элементов. Он будет использован броузером только в том случае, когда элемент CODE окажется внутри элемента Р. При этом свойства текста будут от элемента абзаца — отступ 10);</p><p> от элемента CODE — фон white). А стиль, который можно условно назвать «P CODE» внесет дополнительные форматы:</p><p> полужирное начертание bold);</p><p> фиолетовый цвет букв violet) и размер символов 12pt). Тут уместно вспомнить о 66 Глава 3. Основные элементы HTML версии ' элементах содержания, которые пришли из предыдущих версий языка и вроде бь бесполезны: для которых они предназначались, кажутся сейчас архаичны ми. Действительно, зачем предусматривать отдельные элементы для таких тов, как «текст телетайпа» или «символы, введенные с клавиатуры»? Стили таким элементам вторую жизнь. Вложения двух элементов позволяют любое количество комбинаций форматов.</p><p> Обратите внимание, что в последней строке приведенного примера элемен ты Р и CODE разделены пробелом. Когда элементы отделены друг от друга пробела ми, это означает, что ряду элементов присваивается один и тот же стиль.</p><p> ПРИМЕЧАНИЕ Как это все выглядит на практике, можно увидеть в файле на прилагаемой дискете Использование элемента STYLE не исключает возможность указания атрибута style Все элементы, которые будут модифицированы при помощи атрибута style, лучат форматирование, отличное от того, которое может быть задано при элемента STYLE. Иными словами, атрибут style имеет более высокий приоритет.</p><p> Элемент STYLE может использовать стандартные атрибуты: type, title.</p><p> Классы Ограничения по использованию стилей в последнем примере очевидны.</p><p> элементу можно присвоить только один стиль. Гораздо удобнее назначать для стилей имена и указывать последние вместе с элементами. Такие стили называются классами. Вот простой пример. Создадим, используя STYLE, стиль заголовка с буквами красивого красного цвета:</p><p> <STYLE H1.red1 text-align:</p><p> </style> Цвет задан с помощью функции Ее аргументами являются десятичные числа, Теперь, если надо использовать заголовок, его конструкция должна выглядеть так:</p><p> <Н1 Текст заголовка </h1> При желании можно создать класс red3 и т. д. Очевидно, что такой подход более удобен: можно иметь сколько угодно вариантов форматирования для одно го элемента.</p><p> Универсальные классы: атрибут id Следующим шагом, расширяющим возможности разработчика, является исполь зование универсальных классов, то есть таких, которые не связаны с конкретны ми элементами. Вот простой пример. Допустим, надо создать формат, который позволял бы придать буквам серо-стальной цвет. Назовем этот формат «steel».</p><p> Для него (внутри элемента STYLE) можно ввести таблицу стиля:</p><p> font-weight:</p><p> Таблицы стилей Поскольку оттенок надо подбирать очень точно, без функции опять не обой тись. Учитывая, что буквы получатся достаточно светлыми, можно добавить в стиль полужирное Обратите внимание, что о размере символов в формате данных нет. Поэтому такой формат (стиль) можно применять для раз личных элементов: заголовков и обычного текста. Но для указания стиля надо ис пользовать атрибут id, например:</p><p> <Н2 Заголовок "steel" </h2> <Р отформатированный универсальным стилем "steel" </p> В результате размер букв будет определяться другими настройками: значениями по умолчанию или стилями элементов. Это очень удобно: таким способом легко выдержать стилевую целостность текста: известно, что текстовые документы смотрятся лучше, когда для них используется шрифт и один цвет шрифта.</p><p> Обилие различных шрифтов и эффектов форматирования может только повре дить восприятию.</p><p> Каскадные таблицы стилей: элемент <LINK> Таблицы стилей могут сохраняться в отдельном файле и использоваться для раз ных Web-страниц. Такие таблицы называются каскадными (CSS). Они названы так потому, что несколько (стили автора страницы, сервера, пользова теля) могут использоваться одновременно. В этом случае стили «накладываются» на друга, и более поздние определения отменяют принятые ранее установки.</p><p> Чтобы подключить к странице файл с таблицами стилей, надо использовать эле мент LINK в секции HEAD:</p><p> <LINK В этом случае стили используются так же, как и в предыдущих примерах этого раздела. Например, может содержать следующие определения:</p><p> : green;</p><p> :</p><p> :</p><p> В результате на странице могут оказаться три стиля абзацев, показанные на рис. 3.4.</p><p> ТЕКСТ - «МАЛЫЕ ПРОПИСНЫЕ» Текст абзаца - курсив и цвет букв.</p><p> Текст абзаца (class = - добавлена раз рядка.</p><p> Рис. 3.4. Стили абзацев ПРИМЕЧАНИЕ Примеры использования классов и стилей находятся в файлах и при лагаемой дискете.</p><p> 68 _ Глава 3. Основные элементы HTML версии <DIV> </div> и <SPAN> </span> Существует два элемента, которые специально предназначены для применения стилей. Вы уже знаете, что таблицы стилей универсальны: их можно использовать со многими элементами. Разберем особенности данных элементов.</p><p> Для определения стилей допустимы все синтаксические правила, о которых рас сказывалось в этом разделе. элемента DIV является то, что он назначен для указания в качестве контейнера элементов, то есть собственный стиль должен влиять на стили элементов, находящихся внутри. Вот шаблон для использования элемента DIV:</p><p> <HEAD> <STYLE { Свойство: } </style> </head> <BODY> <DIV <H1> Заголовок </h1> <Р>Первый абзац абзац </body> Элемент SPAN, наоборот, предназначен для в состав других элементов:</p><p> <HEAD> <STYLE { Свойство: значение;</p><p> } </style> </head> <BODY> <H1> Заголовок </h1> <P><SPAN Текст 2 </p> </body> Выводы Теперь можно сделать некоторые выводы относительно таблиц стилей.</p><p> • Свойства, задаваемые при помощи стилей, позволяют использовать практически неограниченное число вариантов форматирования. стилен снимают спецификацией HTML.</p><p> • С точки свойства можно задавать разными способами: в одном элементе (inline);</p><p> для всех элементов на странице;</p><p> для класса элементов;</p><p> для ряда с Списки _ _ • свойств достаточно велик, и в дальнейшем видимо, будет расши ряться. Для различных групп элементов (текст, списки и т. д.) существуют свои наборы свойств.</p><p> • Теперь существует разделить сам документ и стилевое оформле ние. словами, для страницы можно применять разные стили, не меняя сам документ.</p> <div class="po5"></div> <div class='stranici1'><b class='temiser'>Pages:</b> &nbsp;&nbsp;&nbsp;&nbsp;|<div class='kr'><a class="kn1" href="/1/34779-1-luchshiy-vibor-aleksey-goncharov-etoy-knige-naydete-ormi-tablici-freymi-priemi-razmetki-giperteksta.php" title=""> 1 </a></div>|<a class="kn1" href="/1/34779-2-luchshiy-vibor-aleksey-goncharov-etoy-knige-naydete-ormi-tablici-freymi-priemi-razmetki-giperteksta.php" title=""> 2 </a>|<a class="kn1" href="/1/34779-3-luchshiy-vibor-aleksey-goncharov-etoy-knige-naydete-ormi-tablici-freymi-priemi-razmetki-giperteksta.php" title=""> 3 </a>|<a class="kn1" href="/1/34779-4-luchshiy-vibor-aleksey-goncharov-etoy-knige-naydete-ormi-tablici-freymi-priemi-razmetki-giperteksta.php" title=""> 4 </a>|</div> <div class="separator2"></div> <div class="po122"> <img class="doc" src="/images/doc.gif" border="0" alt="" ><a class="menusil" href="/1/" title=""><b class="jir">Книги, научные публикации</b></a> </div> <div class="niz2"> <br><br> <noindex> <center> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- dislib-kvadrat (niz) --> <ins class="adsbygoogle" style="display:inline-block;width:336px;height:280px" data-ad-client="ca-pub-9894471784993021" data-ad-slot="3110193131"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </center> </noindex> <br> <div class="naverh"><A href="#verh" >наверх</a><img src="/images/s.gif" hspace="3" width="5" height="11" border="0" alt="" align="top" vspace="3" ></div> </td></tr></table> <table width="100%" cellspacing="0" cellpadding="0" border=0> <tr> <td bgcolor="#CCCCFF" height="1"> </td> </tr> <tr> <td class="menu-niz"> <center> <table cellspacing="0" cellpadding="0" border=0> <tr> <td class="menu-niz1">&nbsp;|&nbsp; • <a href="/" title="На главную">Главная</a> &nbsp;|&nbsp; • <a href="/admin/contact-kontakti-dissertatsii.php" title="Контакты">Контакты</a>&nbsp;|&nbsp; </td> </tr> </table> </center> </td> </tr> <tr><td class="line1"></td> </tr> </table></td><td class="line"><img class="lin" src="/images/spaser1.gif" border="0" alt=""></td></tr></table> </td><td valign="top"> <table width="5" border="0" cellspacing="0" cellpadding="0"> <tr> <td></td></tr></table></td></tr></table> </td><td class="site2"></td></tr><tr><td colspan="3"> <noindex> <script type='text/javascript' src='http://recreativ.ru/rcode.97536708c5.js'></script> <script type='text/javascript' src='http://recreativ.ru/rcode.88aa634d1b.js'></script> <script type='text/javascript' src='http://recreativ.ru/rcode.30746632cd.js'></script> </noindex> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td valign="top" class="cap1"> <font color="#808080">© 2011 www.dissers.ru - «Бесплатная электронная библиотека»<br><br> <noindex> Материалы этого сайта размещены для ознакомления, все права принадлежат их авторам. <br> Если Вы не согласны с тем, что Ваш материал размещён на этом сайте, пожалуйста, <a href="/admin/contacts.php" title="">напишите нам</a>, мы в течении 1-2 рабочих дней удалим его. </noindex> </font> </div> </td> </tr> </table> <noindex> <!-- Yandex.Metrika counter --> <script src="//mc.yandex.ru/metrika/watch.js" type="text/javascript"></script> <script type="text/javascript"> try { var yaCounter78166 = new Ya.Metrika({id:78166,type:1}); } catch(e) { } </script> <noscript><div><img src="//mc.yandex.ru/watch/78166?cnt-class=1" style="position:absolute; left:-9999px;" alt="" /></div></noscript> <!-- /Yandex.Metrika counter --> </noindex></td></tr></table> </body> </html>
Pages:     || 2 | 3 | 4 |
-- [ Страница 1 ] --

Лучший выбор!

Алексей Гончаров В этой книге вы найдете:

ормы, таблицы, фреймы приемы разметки гипертекста создание графики для HTML документов таблицы обзор редакторов сок На прилагаемой дискете вы найдете файлы Web-страниц, работа с которыми рассматривается в книге Алексей Гончаров Москва • Санкт-Петербург • Нижний Новгород • Воронеж Ростов-на-Дону • Екатеринбург • Самара Киев • Харьков • Минск 2002 Гончаров Самоучитель HTML Главный редактор Е.

Заведующий редакцией И.

Руководитель проекта И. Корнеев Литературный редактор А. Жданов Художник Я.

Корректоры Я Лукина, А.

Верстка Р.

Гончаров А.

Г65 Самоучитель HTML. — СПб.: Питер, 2002. — 240 ил.

ISBN 5-272-00072-2 Книга HTML — популярному языку гипертекстовой разметки документов, позволяющему создавать интерактивные публикации в Интернете. В ней приведено описание самого языка, обсуждаются особенности применения графики на техника подготовки данных для распространения в Интернете и другие задачи, стоящие перед создателями HTML-документов. Все примеры записаны на прилагаемую к книге дискету.

© ЗАО Издательский дом «Питер», Никакая часть данной книги может быть воспроизведена в какой бы то ни было форме без письменного разрешения владельцев авторских Информация, содержащаяся в данной получена из издательством как надежные. Тем не менее, имея в виду человеческие или технические ошибки, не может гарантировать абсолютную точность и приводимых сведений и не несет ответственности за возможные ошибки, связанные с использованием книги.

ISBN 5-272-00072- «Питер Принт». Санкт-Петербург, ул. Благодатная, д. 67в.

Лицензия ИД № 05784 от Налоговая льгота - общероссийский классификатор продукции 005-93, том 2;

953005 - литература учебная.

Подписано в печать Формат Усл. п. л. Доп. экз. Заказ № Отпечатано с фотоформ в «Печатный двор» им. Горького Министерства РФ по делам печати, телерадиовещания и средств массовых коммуникаций.

Санкт-Петербург, пр., 15.

Краткое содержание Предисловие Глава 1 • Введение Глава 2 • Синтаксис Глава 3 • Основные элементы HTML версии Глава 4 • Объекты и формы Глава 5 Глава б • Приемы разметки гипертекста Глава 7 • Создание графики Глава 8 • Редакторы гипертекста Приложение А • числа Приложение Б • Свойства таблиц стилей Приложение В • Состав прилагаемой дискеты Приложение Г • Источники информации в Интернете по тематике книги Алфавитный указатель Содержание Предисловие От издательства Глава 1 • Введение Для кого предназначена эта книга Что есть в этой книге Немного истории HTML как явление нашей жизни Терминология Особенности гипертекста Просмотр Web-страниц Microsoft Internet Explorer Netscape Communicator Глава 2т Синтаксис HTML 4 Версии HTML Анатомия Web-страницы 1 Лучший выбор! Алексей Гончаров В этой книге вы найдете: ормы, таблицы, фреймы приемы разметки гипертекста создание графики для HTML документов таблицы обзор редакторов сок На прилагаемой дискете вы


Правила синтаксиса Кодирование символов Использование спецсимволов Типы Управление цветом... Содержание Глава 3 • Основные элементы HTML версии 4 Заголовок страницы 1 Лучший выбор! Алексей Гончаров В этой книге вы найдете: ормы, таблицы, фреймы приемы разметки гипертекста создание графики для HTML документов таблицы обзор редакторов сок На прилагаемой дискете вы < STYLE > и Стандартные атрибуты Атрибуты событий Форматирование текста <Рх/р>
.-.
 
или и Табуляция, переносы Элементы содержания <ЕМ> и .' и Таблицы стилей Классы классы: атрибут id Каскадные таблицы стилей: элемент
и Выводы Списки
Гиперссылки : Таблицы
Выравнивание данных в ячейках
Группы строк: