HTML, JavaScript, PHP и MySQL. Джентльменский набор Web-мастера


Содержание

HTML, javascript, PHP и MySQL. Джентльменский набор Web-мастера, 4-е издание (2015)

Автор: Н. Прохоренок, В. Дронов
Издательство: БХВ-Петербург
Год: 2015
Страниц: 766
Перевод: Русский
Формат: pdf
Размер 91.7 Мб

Содержание Рассмотрены вопросы создания интерактивных Web-сайтов с помощью НТML, javascript, PHP и MySQL, форматирования Web-страниц при помощи CSS. Даны основы РНР и примеры написания типичных сценариев.
Подробнее

HTML, javascript, PHP и MySQL. Джентльменский набор Web-мастера, 4-е издание (2015)

Описание книги «Бесплатно скачать без СМС HTML, javascript, PHP и MySQL. Джентльменский набор Web-мастера, 4-е издание (2015)»

Автор: Н. Прохоренок, В. Дронов
Издательство: БХВ-Петербург
Год: 2015
Страниц: 766
Язык: Русский
Формат: pdf
Размер 91.7 Мб

Описание Рассмотрены вопросы создания интерактивных Web-сайтов с помощью НТML, javascript, PHP и MySQL, форматирования Web-страниц при помощи CSS. Даны основы РНР и примеры написания типичных сценариев.
Подробнее

HTML, JavaScript, PHP и MySQL. Джентльменский набор Web-мастера

Создание интерактивных сайтов с помощью HTML, JavaScript, PHP и MySQL. Таблицы стилей (CSS). Конструкции языка PHP. Написание сценариев, базы данных MySQL и их администрирование. Программная среда на компьютере разработчика, настройка Web-сервера Apache.

Рубрика Программирование, компьютеры и кибернетика
Вид учебное пособие
Язык русский
Дата добавления 18.11.2014
Размер файла 7,5 M

Отправить свою хорошую работу в базу знаний просто. Используйте форму, расположенную ниже

Студенты, аспиранты, молодые ученые, использующие базу знаний в своей учебе и работе, будут вам очень благодарны.

HTML-версии работы пока нет.
Cкачать архив работы можно перейдя по ссылке, которая находятся ниже.

Подобные документы

Установка и настройка локального web–сервера и его компонентов. Конфигурационные файлы сервера Apache и их натройка. Настройка PHP, MySQL и Sendmail. Проверка работоспособности виртуальных серверов. Создание виртуальных хостов. Тест Server Side Includes.

учебное пособие [6,2 M], добавлен 27.04.2009

Основные технологии веб-программирования. Методы отправки данных на сервер с помощью HTML-формы. PHP — Препроцессор Гипертекста. Сохранение данных в базе данных MySQL. Клиент-Сервер и технология CGI. Примеры использования PHP совместно с MySQL.

лекция [2,9 M], добавлен 27.04.2009

Характеристика и технические возможности СУБД MySQL. Трехуровневая структура MySQL. Требования к аппаратному обеспечению. Создание таблицы, триггеров, генераторов, хранимых процедур в MySQL. Разработка приложения для базы данных с помощью Borland Delphi.

курсовая работа [940,7 K], добавлен 20.12.2011

Создание HTML-форм. Ввод многострочного текста. Тег FORM — контейнер форм. Трансляция переменных окружения. Передача данных с помощью формы. Приложения, хранящие данные о регистрации пользователей в базе данных MySQL. Порядок трансляции переменных.

лекция [5,6 M], добавлен 27.04.2009

Нормализация предметной области «Сайт знакомств» и ее программная реализация с использованием СУБД MySQL, языка HTML, технологии PHP и ADO, скриптовых языков VBScript или JavaScript. Руководство программиста, тестирование, исходный текст приложения.

реферат [29,0 K], добавлен 09.09.2010

Анализ предметной области «Ремонт часов», с использованием СУБД MySQL, языка HTML, технологии PHP и ADO и выбора скриптовых языков VBScript или JavaScript. Нормализация базы данных. Пошаговое описание нормализации базы данных (методом ER-диаграмм).

курсовая работа [782,4 K], добавлен 18.06.2010

Язык маркировки гипертекстов HTML, основа создания web-страниц. История спецификаций, каскадные таблицы стилей CSS. Способы определения таблиц стилей (стилевого шаблона). Язык подготовки сценариев JavaScript, его использование. Программный код web сайта.

курсовая работа [26,9 K], добавлен 05.07.2009

Синтаксис, типы данных, используемые в базе данных MySQL. Создание и удаление базы данных, создание таблицы и удаление таблицы, изменение ее свойств. Переименование, вставка и удаление столбцов, изменение их свойств. Обновление и поиск записей в таблице.

лабораторная работа [641,7 K], добавлен 04.03.2010

Основные технологии разработки ресурсов Интернет. Процесс разработки веб-сайта. Понятие Web-сайта и классификация Web-сайтов. Основные этапы разработки Web-сайта. Использование HTML, CSS, JavaScript, FLASH, PHP и реляционной базы данных MySQL.

презентация [1,3 M], добавлен 28.11.2015

Базовый синтаксис языка сценариев JavaScript. Создание страниц, включающих в себя программы, которые взаимодействуют с пользователем, управляют браузером и динамически создают HTML-содержимое. Работа с объектами, которые инкапсулируют данные и поведение.

лабораторная работа [58,6 K], добавлен 25.05.2020

Работы в архивах красиво оформлены согласно требованиям ВУЗов и содержат рисунки, диаграммы, формулы и т.д.
PPT, PPTX и PDF-файлы представлены только в архивах.
Рекомендуем скачать работу.

Поделиться

Данный товар недоступен для доставки в Ваш регион

Спасибо!

Мы всегда стремимся к лучшему, чтобы радовать своих покупателей самыми выгодными ценами.

С уважением, интернет-магазин Wildberries.

Добавлено в Лист ожидания

Зарезервируйте товар и получите в магазине уже через 1 час

Срок резерва: 4 дня

Оплата: в магазине, наличными или картой

Информация о технических характеристиках, комплекте поставки, стране изготовления и внешнем виде товара носит справочный характер и основывается на последних доступных сведениях от производителя

Спасибо!

Мы всегда стремимся к лучшему, чтобы радовать своих покупателей самыми выгодными ценами.

HTML, javascript, PHP и MySQL. Джентльменский набор Web-мастера

This content was uploaded by our users and we assume good faith they have the permission to share this book. If you own the copyright to this book and it is wrongfully on our website, we offer a simple DMCA procedure to remove your content from our site. Start by pressing the button below!

Ñàíêò-Ïåòåðáóðã «ÁÕÂ-Ïåòåðáóðã» 2010

681.3.06 32.973.26-018.2 П84

Прохоренок Н. А. П84

HTML, JavaScript, PHP и MySQL. Джентльменский набор Web-мастера. — 3-е изд., перераб. и доп. — СПб.: БХВ-Петербург, 2010. — 912 с.: ил. + Видеокурс (на CD-ROM) — (Профессиональное программирование) ISBN 978-5-9775-0540-6 Рассмотрены вопросы создания интерактивных Web-сайтов с помощью HTML, JavaScript, PHP и MySQL. Представлен материал о применении каскадных таблиц стилей (CSS) для форматирования Web-страниц. Даны основные конструкции языка PHP, на примерах показаны приемы написания сценариев, наиболее часто используемых при разработке Web-сайтов. Описаны приемы работы с базами данных MySQL при помощи PHP, а также администрирования баз данных с помощью программы phpMyAdmin. Особое внимание уделено созданию программной среды на компьютере разработчика и настройке Web-сервера Apache. В 3-м издании книги описываются новые версии программ Apache 2.2.14, PHP 5.3.0 и MySQL 5.1.40. Добавлено описание программ Notepad++, Aptana Studio, NetBeans и HeidiSQL, рассмотрены возможности шаблонизатора Smarty, а также переработаны и дополнены все главы книги. На прилагаемом компакт-диске содержатся листинги более чем двухсот примеров, описанных в книге, руководство по созданию динамического сайта, электронная версия самоучителя языка Perl и видеоуроки. Для Web-разработчиков УДК 681.3.06 ББК 32.973.26-018.2

Группа подготовки издания: Главный редактор Зам. главного редактора Зав. редакцией Редактор Компьютерная верстка Корректор Дизайн серии Оформление обложки Зав. производством

Екатерина Кондукова Евгений Рыбаков Григорий Добин Екатерина Капалыгина Натальи Смирновой Наталия Першакова Инны Тачиной Елены Беляевой Николай Тверских

Ëèöåíçèÿ ÈÄ ¹ 02429 îò 24.07.00. Ïîäïèñàíî â ïå÷àòü 30.01.10. Ôîðìàò 70×1001/16. Ïå÷àòü îôñåòíàÿ. Óñë. ïå÷. ë. 73,53. Òèðàæ 2500 ýêç. Çàêàç ¹ «ÁÕÂ-Ïåòåðáóðã», 190005, Ñàíêò-Ïåòåðáóðã, Èçìàéëîâñêèé ïð., 29. Ñàíèòàðíî-ýïèäåìèîëîãè÷åñêîå çàêëþ÷åíèå íà ïðîäóêöèþ ¹ 77.99.60.953.Ä.005770.05.09 îò 26.05.2009 ã. âûäàíî Ôåäåðàëüíîé ñëóæáîé ïî íàäçîðó â ñôåðå çàùèòû ïðàâ ïîòðåáèòåëåé è áëàãîïîëó÷èÿ ÷åëîâåêà. Îòïå÷àòàíî ñ ãîòîâûõ äèàïîçèòèâîâ â ÃÓÏ «Òèïîãðàôèÿ «Íàóêà» 199034, Ñàíêò-Ïåòåðáóðã, 9 ëèíèÿ, 12

© Прохоренок Н. А., 2010 © Оформление, издательство «БХВ-Петербург», 2010

Оглавление ВВЕДЕНИЕ. 1 Г ЛАВА 1. ОСНОВЫ HTML. СОЗДАЕМ ДИЗАЙН САЙТА . 5 1.1. Основные понятия . 5 1.2. Первый HTML-документ . 9 1.3. Структура документа. 12 1.3.1. Раздел HEAD. Техническая информация о документе. 13 1.3.2. Раздел BODY. Основная часть документа . 15 1.4. Форматирование отдельных символов. 16 1.4.1. Выделение фрагментов текста. 17 1.4.2. Создание нижних и верхних индексов . 17 1.4.3. Вывод текста заданным шрифтом. 18 1.5. Форматирование документа . 19 1.5.1. Тег комментария . 20 1.5.2. Перевод строки . 20 1.5.3. Горизонтальная линия . 21 1.5.4. Заголовки . 22 1.5.5. Разделение на абзацы . 22 1.6. Списки. 23 1.6.1. Маркированные списки. 23 1.6.2. Нумерованные списки . 24 1.6.3. Списки определений. 26 1.7. Графика. 27 1.7.1. Изображение на Web-странице . 27 1.7.2. Изображение в качестве фона . 29 1.8. Гиперссылки. 30 1.8.1. Внешние гиперссылки. 30 1.8.2. Внутренние гиперссылки . 32 1.8.3. Гиперссылки на адрес электронной почты . 33 1.9. Таблицы . 34 1.9.1. Вставка таблицы в документ . 35 1.9.2. Заголовок таблицы. 36 1.9.3. Строки таблицы . 36 1.9.4. Ячейки таблицы . 37

1.10. Фреймы . 40 1.10.1. Разделение окна Web-браузера на несколько областей . 40 1.10.2. Структура HTML-документа, содержащего фреймы . 44 1.10.3. Описание фреймовой структуры . 45 1.10.4. Описание отдельных областей . 46 1.10.5. Тег . 47 1.10.6. Загрузка документа в определенный фрейм . 47 1.10.7. Тег . Добавление фрейма в обычный документ . 48 1.11. Карты-изображения . 50 1.11.1. Карта-изображение как панель навигации . 51 1.11.2. Структура карт-изображений. 52 1.11.3. Тег . 53 1.11.4. Описание активной области на карте-изображении. 53 1.12. Формы . 55 1.12.1. Создание формы для регистрации сайта . 55 1.12.2. Структура документа с формами. 57 1.12.3. Добавление формы в документ . 57 1.12.4. Описание элементов управления. 59 1.12.5. Тег . 64 1.12.6. Группировка элементов формы. 67 1.13. Теги и . Группировка элементов страницы. 67 1.14. Отличия XHTML 1.0 от HTML 4.01 . 69 1.15. Проверка HTML-документов на соответствие стандартам . 73 1.16. Специальный тег в Web-браузере Internet Explorer. 74 Г ЛАВА 2. ОСНОВЫ CSS. ФОРМАТИРУЕМ WEB-СТРАНИЦУ С ПОМОЩЬЮ СТИЛЕЙ . 77 2.1. Основные понятия . 77 2.2. Способы встраивания определения стиля. 78 2.2.1. Встраивание определения стиля в тег. 78 2.2.2. Встраивание определения стилей в заголовок HTML-документа . 78 2.2.3. Вынесение таблицы стилей в отдельный файл. 83 2.2.4. Приоритет применения стилей . 85 2.3. Единицы измерения в CSS. 87 2.4. Форматирование шрифта . 88 2.4.1. Имя шрифта. 88 2.4.2. Стиль шрифта. 89 2.4.3. Размер шрифта . 89 2.4.4. Цвет шрифта. 89 2.4.5. Жирность шрифта . 90

2.5. Форматирование текста. 90 2.5.1. Расстояние между символами в словах . 90 2.5.2. Расстояние между словами . 90 2.5.3. Отступ первой строки. 91 2.5.4. Вертикальное расстояние между строками. 91 2.5.5. Горизонтальное выравнивание текста . 91 2.5.6. Вертикальное выравнивание текста. 92 2.5.7. Подчеркивание, надчеркивание и зачеркивание текста. 92 2.5.8. Изменение регистра символов. 93 2.5.9. Обработка пробелов между словами . 93 2.6. Отступы . 94 2.6.1. Внешние отступы. 94 2.6.2. Внутренние отступы . 95 2.7. Рамки. 96 2.7.1. Стиль линии рамки . 96 2.7.2. Толщина линии рамки . 98 2.7.3. Цвет линии рамки . 98 2.7.4. Одновременное задание атрибутов рамки . 99 2.8. Фон элемента. 99 2.8.1. Цвет фона. 99 2.8.2. Фоновый рисунок. 100 2.8.3. Режим повтора фонового рисунка . 100 2.8.4. Прокрутка фонового рисунка . 100 2.8.5. Положение фонового рисунка . 101 2.8.6. Одновременное задание атрибутов фона . 101 2.9. Списки. 102 2.9.1. Вид маркера списка . 102 2.9.2. Изображение в качестве маркера списка. 102 2.9.3. Компактное отображение списка . 103 2.10. Вид курсора . 103 2.11. Псевдостили гиперссылок. Отображение ссылок разными цветами . 104 2.12. Форматирование блоков . 106 2.12.1. Указание типа блока . 106 2.12.2. Установка размеров . 108 2.12.3. Атрибут overflow . 109 2.12.4. Управление обтеканием . 111 2.12.5. Позиционирование блока. 113 2.12.6. Последовательность отображения слоев. 115 2.13. Управление отображением элемента. 117 2.14. Проверка CSS-кода на соответствие стандартам . 119

Г ЛАВА 3. ОСНОВЫ JAVASCRIPT. ДЕЛАЕМ СТРАНИЦЫ, РЕАГИРУЮЩИЕ НА ДЕЙСТВИЯ ПОЛЬЗОВАТЕЛЕЙ . 121 3.1. Основные понятия . 121 3.2. Первая программа на JavaScript . 121 3.3. Комментарии в JavaScript . 124 3.4. Вывод результатов работы программы и ввод данных . 124 3.4.1. Окно с сообщением и кнопкой OK . 125 3.4.2. Окно с сообщением и кнопками OK и Cancel. 126 3.4.3. Окно с полем ввода и кнопками OK и Cancel. 127 3.5. Переменные. 127 3.6. Типы данных и инициализация переменных. Определение типа данных переменной . 128 3.7. Операторы JavaScript. 130 3.7.1. Математические операторы . 130 3.7.2. Операторы присваивания. 132 3.7.3. Двоичные операторы . 132 3.7.4. Оператор обработки строк . 133 3.7.5. Приоритет выполнения операторов . 134 3.8. Преобразование типов данных. 135 3.9. Специальные символы. Разбиение сообщения в диалоговом окне на несколько строк. 138 3.10. Массивы. 139 3.11. Функции. Разделение программы на фрагменты . 142 3.11.1. Основные понятия . 142 3.11.2. Расположение функций внутри HTML-документа. 144 3.11.3. Рекурсия. Вычисление факториала . 146 3.11.4. Глобальные и локальные переменные . 147 3.12. Условные операторы. Выполнение блоков кода только при соответствии условию. 149 3.12.1. Операторы сравнения . 149 3.12.2. Оператор ветвления if…else. Проверка ввода пользователя. 150 3.12.3. Оператор ? Проверка числа на четность . 153 3.12.4. Оператор выбора switch. 154 3.13. Операторы циклов. Многократное выполнение блока кода . 156 3.13.1. Цикл for. 156 3.13.2. Цикл while. 158 3.13.3. Цикл do…while . 159 3.13.4. Оператор continue. Переход на следующую итерацию цикла. 160 3.13.5. Оператор break. Прерывание цикла . 160

3.14. Ошибки в программе. 161 3.14.1. Синтаксические ошибки . 161 3.14.2. Логические ошибки . 162 3.14.3. Ошибки времени выполнения . 162 3.14.4. Обработка ошибок . 163 3.14.5. Модуль Firebug для Web-браузера Firefox. 164 3.15. Встроенные классы JavaScript . 167 3.15.1. Основные понятия . 167 3.15.2. Класс Global . 168 3.15.3. Класс Number. Работа с числами. 170 3.15.4. Класс String. Обработка строк . 171 3.15.5. Класс Array. Работа с массивами и их сортировка. 173 3.15.6. Класс Math. Использование математических функций . 180 3.15.7. Класс Date. Получение текущей даты и времени. Вывод даты и времени в окне Web-браузера . 182 3.15.8. Класс Function (функции) . 186 3.15.9. Класс Arguments. Функции с произвольным количеством аргументов . 187 3.15.10. Класс RegExp. Проверка значений с помощью регулярных выражений . 188 3.16. События . 199 3.16.1. Основные понятия . 199 3.16.2. События мыши . 199 3.16.3. События клавиатуры. 200 3.16.4. События документа. 200 3.16.5. События формы. 201 3.16.6. Последовательность событий . 201 3.16.7. Всплывание событий . 203 3.16.8. Действия по умолчанию и их отмена. 205 3.16.9. Написание обработчиков событий. 207 3.16.10. Объект event. Вывод координат курсора и кода нажатой клавиши. Вывод сообщений при нажатии комбинации клавиш . 214 3.17. Объектная модель Microsoft Internet Explorer . 220 3.17.1. Структура объектной модели . 220 3.17.2. Объект window. Вывод сообщения в строку состояния Web-браузера. 221 3.17.3. Работа с окнами. Создание нового окна без строки меню, адресной строки и панели инструментов . 227 3.17.4. Модальные диалоговые окна. Использование модальных окон вместо встроенных диалоговых окон . 231 3.17.5. Таймеры. Создание часов на Web-странице . 234

3.17.6. Объект navigator. Получение информации о Web-браузере пользователя. Перенаправление клиента на разные страницы в зависимости от Web-браузера. 236 3.17.7. Объект screen. Получение информации о мониторе пользователя. 241 3.17.8. Объект location. Разбор составляющих URL-адреса документа. Создание многостраничных HTML-документов . 242 3.17.9. Объект history. Получение информации о просмотренных страницах. Реализация перехода на предыдущую просмотренную страницу. 247 3.17.10. Объект document. Получение полной информации о HTML-документе . 248 3.17.11. Обращение к элементам документа. Выравнивание заголовков по центру. 255 3.17.12. Работа с элементами документа. Изменение URL-адреса и текста ссылки. Преобразование ссылки в обычный текст. 257 3.17.13. Объект style. Работа с таблицами стилей при помощи JavaScript. 265 3.17.14. Объект selection. Проверка наличия выделенного фрагмента . 268 3.17.15. Объект TextRange. Поиск фрагмента в текстовом поле или документе. Расширение или сжатие выделенного фрагмента текста. 272 3.17.16. Работа с буфером обмена. Выделение фрагмента от позиции щелчка до конца документа и копирование его в буфер обмена . 282 3.17.17. Реализация ссылок «Добавить сайт в Избранное» и «Сделать стартовой страницей». 284 3.17.18. Сохранение данных на компьютере клиента. Определение возможности использования cookies. Сохранение русского текста в cookies . 285 3.18. Работа с элементами формы . 289 3.18.1. Элементы управления. 290 3.18.2. Коллекция Forms. Доступ к элементу формы из скрипта. 291 3.18.3. Свойства объекта формы . 291 3.18.4. Методы объекта формы. 292 3.18.5. События объекта формы . 292 3.18.6. Текстовое поле и поле ввода пароля. Проверка правильности ввода E-mail и пароля. Получение данных из элемента формы. 292 3.18.7. Поле для ввода многострочного текста. Добавление слов из текстового поля в поле . 295 3.18.8. Список с возможными значениями. Возможность добавления нового пункта. Применение списков вместо гиперссылок. 298

3.18.9. Флажок и переключатели. Получение значения выбранного переключателя при помощи цикла и проверка установки флажка. 303 3.18.10. Кнопки. Обработка нажатия кнопки. Деактивация кнопки. Создание клавиши быстрого доступа и вывод текста на кнопке определенным цветом . 306 3.18.11. Проверка корректности данных. Создание формы регистрации пользователя. 309 3.19. Пользовательские объекты . 314 3.19.1. Создание объектов. 314 3.19.2. Прототипы . 318 3.19.3. Пространства имен . 321 3.20. JavaScript-библиотеки. 323 Г ЛАВА 4. ПРОГРАММНОЕ ОБЕСПЕЧЕНИЕ WEB-СЕРВЕРА. УСТАНАВЛИВАЕМ И НАСТРАИВАЕМ ПРОГРАММЫ ПОД WINDOWS . 325 4.1. Необходимые программы . 325 4.2. Установка сервера Apache . 326 4.3. Структура каталогов сервера Apache. 333 4.4. Файл конфигурации httpd.conf . 334 4.4.1. Основные понятия . 334 4.4.2. Разделы файла конфигурации. 335 4.4.3. Общие директивы. Создание домашней директории пользователя, доступной при запросе http://localhost/

nik/ . 337 4.4.4. Директивы управления производительностью . 339 4.4.5. Директивы обеспечения постоянного соединения . 340 4.4.6. Директивы работы с языками . 341 4.4.7. Директивы перенаправления . 341 4.4.8. Обработка ошибок . 342 4.4.9. Настройки MIME-типов . 343 4.4.10. Управление листингом каталога . 345 4.4.11. Директивы протоколирования. 348 4.4.12. Файл конфигурации .htaccess. Управляем сервером Apache из обычной папки. 350 4.4.13. Защита содержимого папки паролем . 351 4.4.14. Управление доступом. 355 4.4.15. Регулярные выражения, используемые в директивах . 356 4.4.16. Создание виртуальных серверов . 357 4.5. Настройка сервера Apache . 360 4.6. Установка PHP . 362 4.7. Установка MySQL. 370

4.8. Установка phpMyAdmin . 379 4.9. Знакомьтесь — Денвер. 385 4.9.1. Установка Денвера. 385 4.9.2. Запуск и остановка Денвера. 393 4.9.3. Создание виртуальных хостов. 393 4.9.4. Конфигурационные файлы Денвера . 395 4.10. Установка и настройка PHP Expert Editor . 395 4.11. Установка и настройка Aptana Studio . 401 4.12. Установка и настройка NetBeans. 412 4.13. Программа HeidiSQL. 418 Г ЛАВА 5. ОСНОВЫ PHP. СОЗДАЕМ ДИНАМИЧЕСКИЕ WEB-СТРАНИЦЫ . 421 5.1. Основные понятия . 421 5.2. Первая программа на PHP . 421 5.3. Методы встраивания PHP-кода . 425 5.4. Комментарии в PHP-сценариях. 426 5.5. Вывод результатов работы скрипта . 427 5.6. Переменные. 429 5.7. Типы данных и инициализация переменных . 429 5.8. Проверка существования переменной. 431 5.9. Удаление переменной . 432 5.10. Константы. Создание и использование констант . 433 5.11. Операторы PHP . 434 5.11.1. Математические операторы . 435 5.11.2. Операторы присваивания. 436 5.11.3. Двоичные операторы . 436 5.11.4. Оператор конкатенации строк. Подстановка значений переменных. Запуск внешних программ . 437 5.11.5. Приоритет выполнения операторов . 440 5.12. Преобразование типов данных. 441 5.13. Специальные символы . 443 5.14. Массивы. 444 5.14.1. Инициализация массива . 444 5.14.2. Получение и изменение элемента массива. Определение количества элементов массива. 444 5.14.3. Многомерные массивы. 445 5.14.4. Ассоциативные массивы . 445 5.14.5. Слияние массивов . 447 5.14.6. Перебор элементов массива. 447 5.14.7. Добавление и удаление элементов массива . 451

5.14.8. Переворачивание и перемешивание массива. 452 5.14.9. Сортировка массива. Создание пользовательской сортировки . 453 5.14.10. Получение части массива. 455 5.14.11. Преобразование переменных в массив. 456 5.14.12. Преобразование массива в переменные . 456 5.14.13. Заполнение массива числами. 457 5.14.14. Преобразование массива в строку. 458 5.14.15. Проверка наличия значения в массиве . 459 5.15. Строки. 460 5.15.1. Функции для работы со строками . 460 5.15.2. Настройка локали. 465 5.15.3. Функции для работы с символами . 466 5.15.4. Поиск и замена в строке. 466 5.15.5. Функции для сравнения строк . 467 5.15.6. Кодирование строк . 468 5.15.7. Преобразование кодировок. 469 5.15.8. Регулярные выражения. Разбираем адрес электронной почты на составные части. Проверяем правильность введенной даты. 470 5.15.9. Perl-совместимые регулярные выражения . 478 5.15.10. Функции для работы со строками в кодировке UTF-8. 487 5.15.11. Перегрузка строковых функций . 496 5.16. Функции для работы с числами. 497 5.17. Функции для работы с датой и временем. Получение текущей даты, даты создания файла и проверка корректности введенной даты . 499 5.18. Функции. Разделение программы на фрагменты . 503 5.18.1. Основные понятия . 503 5.18.2. Расположение описаний функций. 505 5.18.3. Операторы require и include. Выносим функции в отдельный файл. Создаем шаблоны для множества страниц. 506 5.18.4. Операторы require_once и include_once. 509 5.18.5. Рекурсия. Вычисляем факториал . 510 5.18.6. Глобальные и локальные переменные. Передача параметров по ссылке. Использование глобальных переменных внутри функций. 510 5.18.7. Статические переменные . 514 5.18.8. Переменное число параметров в функции. Сумма произвольного количества чисел. 515 5.19. Условные операторы. Выполнение блоков кода только при соответствии условию. 516 5.19.1. Операторы сравнения . 516 5.19.2. Оператор ветвления if…else. Проверка выбранного элемента из списка . 518

5.19.3. Оператор ? Проверка числа на четность . 520 5.19.4. Оператор выбора switch. Использование оператора switch вместо if…else. 522 5.20. Операторы циклов. Многократное выполнение блока кода . 524 5.20.1. Цикл for. 524 5.20.2. Цикл while. 526 5.20.3. Цикл do…while . 526 5.20.4. Цикл foreach . 527 5.20.5. Оператор continue. Переход на следующую итерацию цикла. 528 5.20.6. Оператор break. Прерывание цикла . 529 5.21. Завершение выполнения сценария. Навигация при выборе значения из списка. 529 5.22. Ошибки в программе. 531 5.22.1. Синтаксические ошибки . 531 5.22.2. Логические ошибки . 532 5.22.3. Ошибки времени выполнения . 532 5.22.4. Обработка ошибок . 532 5.22.5. Инструкция or die(). 534 5.23. Переменные окружения . 534 5.23.1. Массив $GLOBALS . 535 5.23.2. Часто используемые переменные окружения . 538 5.24. Заголовки HTTP. 539 5.24.1. Основные заголовки . 542 5.24.2. Функции для работы с заголовками. Перенаправление клиента на другой URL-адрес. Запрет кэширования страниц. Реализация ссылки Скачать. Просмотр заголовков, отправляемых сервером . 544 5.24.3. Работа с cookies. Создаем индивидуальный счетчик посещений . 548 5.25. Работа с файлами и каталогами. 549 5.25.1. Основные понятия . 549 5.25.2. Функции для работы с файлами. Создание файла, запись в файл, вывод содержимого файла в список . 550 5.25.3. Перемещение внутри файла. 554 5.25.4. Создание списка рассылки с возможностью добавления, изменения и удаления E-mail-адресов . 555 5.25.5. Чтение CSV-файлов. Преобразование CSV-файла в HTML-таблицу . 560 5.25.6. Права доступа в операционной системе UNIX . 562 5.25.7. Функции для манипулирования файлами. 564 5.25.8. Загрузка файлов на сервер . 566 5.25.9. Функции для работы с каталогами. Создаем программу для просмотра всех доступных каталогов и файлов на диске. 568 5.25.10. Получение информации из сети Интернет. 572

5.26. Отправка писем с сайта. Рассылка писем по E-mail-адресам из файла . 583 5.27. Аутентификация с помощью PHP. Создание Личного кабинета. 587 5.28. Работа с графикой. 592 5.28.1. Информация об установленной библиотеке GD. 592 5.28.2. Получение информации об изображении. 593 5.28.3. Работа с готовыми изображениями. 597 5.28.4. Создание нового изображения . 599 5.28.5. Работа с цветом . 600 5.28.6. Рисование линий и фигур. 602 5.28.7. Вывод текста в изображение. Создаем счетчик посещений. 604 5.28.8. Изменение размеров и копирование изображений. 609 5.29. Обработка данных формы. 612 5.29.1. Текстовое поле, поле ввода пароля и скрытое поле . 612 5.29.2. Поле для ввода многострочного текста . 613 5.29.3. Список с возможными значениями. 613 5.29.4. Флажок. 615 5.29.5. Элемент-переключатель. 616 5.29.6. Кнопка Submit. 616 5.29.7. Проверка корректности данных. Создание формы регистрации пользователя. 617 5.30. Другие полезные функции . 622 5.30.1. Выделение фрагментов исходного кода. 623 5.30.2. Получение информации об интерпретаторе. 623 5.30.3. Вывод всех доступных сценарию функций. 623 5.30.4. Засыпание сценария. 624 5.30.5. Изменение значения директив во время выполнения сценария . 625 5.30.6. Выполнение команд, содержащихся в строке . 627 5.31. Объектно-ориентированное программирование . 627 5.31.1. Создание класса . 628 5.31.2. Конструктор и деструктор. 629 5.31.3. Наследование . 631 5.31.4. Статические свойства и методы . 633 5.31.5. Объявление констант внутри класса. 634 5.31.6. Определение области видимости . 634 5.31.7. Создание шаблона сайта при помощи класса . 637 5.32. Шаблонизатор Smarty. 639 5.32.1. Установка и настройка . 639 5.32.2. Управляющие конструкции . 643 5.32.3. Модификаторы переменных . 649 5.32.4. Кэширование страниц . 654

Г ЛАВА 6. ОСНОВЫ MYSQL. РАБОТАЕМ С БАЗАМИ ДАННЫХ. 661 6.1. Основные понятия . 661 6.2. Нормализация базы данных. 661 6.3. Типы данных полей . 665 6.3.1. Числовые типы . 666 6.3.2. Строковые типы . 666 6.3.3. Дата и время . 667 6.4. Основы языка SQL. 668 6.4.1. Создание базы данных . 668 6.4.2. Создание пользователя базы данных . 669 6.4.3. Создание таблицы. 671 6.4.4. Вставка данных в таблицу . 674 6.4.5. Обновление записей . 677 6.4.6. Удаление записей из таблицы . 678 6.4.7. Изменение свойств таблицы . 679 6.4.8. Выбор записей. 680 6.4.9. Выбор записей из нескольких таблиц. 682 6.4.10. Индексы. Ускорение выполнения запросов . 687 6.4.11. Удаление таблицы и базы данных. 692 6.5. Доступ к базе данных из PHP с помощью библиотеки php_mysql.dll. 693 6.5.1. Установка соединения. 693 6.5.2. Выбор базы данных . 694 6.5.3. Выполнение запроса к базе данных . 694 6.5.4. Обработка результата запроса . 695 6.6. Доступ к базе данных из PHP с помощью библиотеки php_mysqli.dll. 702 6.6.1. Установка соединения. 702 6.6.2. Выбор базы данных . 704 6.6.3. Выполнение запроса к базе данных . 704 6.6.4. Обработка результата запроса . 706 6.7. Операторы MySQL . 714 6.7.1. Математические операторы . 715 6.7.2. Двоичные операторы . 717 6.7.3. Операторы сравнения . 717 6.7.4. Приоритет выполнения операторов . 719 6.7.5. Преобразование типов данных . 720 6.8. Поиск по шаблону . 721 6.9. Поиск с помощью регулярных выражений . 725 6.10. Режим полнотекстового поиска . 729 6.10.1. Создание индекса FULLTEXT. 729 6.10.2. Реализация полнотекстового поиска. 731

6.10.3. Режим логического поиска . 732 6.10.4. Поиск с расширением запроса. 733 6.11. Функции MySQL. 733 6.11.1. Функции для работы с числами. 733 6.11.2. Функции даты и времени . 738 6.11.3. Функции для обработки строк. 750 6.11.4. Функции для шифрования строк . 757 6.11.5. Информационные функции. 758 6.11.6. Прочие функции. 760 6.12. Переменные SQL . 764 6.13. Временные таблицы . 765 6.14. Вложенные запросы . 767 6.14.1. Заполнение таблицы с помощью вложенного запроса . 768 6.14.2. Применение вложенных запросов в инструкции WHERE . 770 6.15. Внешние ключи. 772 Г ЛАВА 7. ПУБЛИКАЦИЯ САЙТА. ДЕЛАЕМ САЙТ ДОСТУПНЫМ ДЛЯ ВСЕХ . 775 7.1. Определение цели. 775 7.2. Выбор доменного имени . 776 7.3. Виды хостинга. 779 7.4. Бесплатный хостинг Narod.ru . 780 7.4.1. Регистрация и обзор возможностей . 781 7.4.2. Создание страницы «Обратная связь». 782 7.4.3. Загрузка контента на сервер . 784 7.4.4. Управление гостевой книгой, форумом и чатом . 786 7.5. Платный виртуальный хостинг . 791 7.5.1. Выбор тарифного плана . 791 7.5.2. Регистрация и обзор возможностей . 792 7.5.3. Структура Контрольной панели . 793 7.5.4. Структура каталогов сервера и загрузка контента на сервер . 796 7.5.5. Настройка Web-сервера Apache с помощью файла .htaccess . 804 7.5.6. Файл favicon.ico. 806 7.5.7. Защита содержимого папки с помощью Web-сервера Apache. 807 7.5.8. Загрузка файлов на сервер с помощью формы . 809 7.5.9. Создание базы данных MySQL. 812 7.5.10. Управление базой данных с помощью phpMyAdmin. 813 7.5.11. Отправка почты с сайта. 817 7.5.12. Анализ статистики и работа с логами сервера. 818 7.5.13. Автоматический запуск программ в заданное время . 820

7.6. Раскрутка сайта . 823 7.6.1. Подготовка страниц сайта к индексации. 823 7.6.2. Файл robots.txt . 824 7.6.3. Регистрация в каталогах и рейтингах . 825 7.6.4. Участие в баннерообменных сетях . 827 7.6.5. Обмен ссылками с Web-мастерами. 827 7.7. Заработок в сети. 828 7.7.1. Партнерские программы . 828 7.7.2. Рекламные сети . 830 7.7.3. Электронные деньги . 831 7.8. Перечень полезных сайтов. 832 П РИЛОЖЕНИЕ . ОПИСАНИЕ КОМПАКТ-ДИСКА . 835 П.1. Видеоролики. 835 П.1.1. HTML . 836 П.1.2. Работа с изображениями . 844 П.1.3. Flash . 851 П.1.4. PHP и MySQL . 859 П.1.5. Редакторы . 862 П РЕДМЕТНЫЙ УКАЗАТЕЛЬ . 869

Введение Если вы хотите научиться своими руками создавать сайты, свободно владеть HTML, CSS, JavaScript, PHP и MySQL, то эта книга для вас. Большинство подобных книг предлагают изучение или только клиентских технологий (HTML, CSS, JavaScript), или только серверных (PHP, MySQL). Но разделять эти технологии нельзя, так как они могут существовать только совместно, а значит, и изучать их нужно только как единое целое. Все главы книги расположены в порядке возрастания уровня сложности материала. Если вы начинающий Web-мастер, то книгу следует изучать именно в порядке расположения глав. Исключение составляет лишь глава 7, в которой говорится о размещении сайта в сети Интернет. К ней можно обратиться когда угодно, так как для создания простого статического сайта достаточно знать лишь язык разметки HTML. Если материал какой-либо из глав был изучен ранее, то можно сразу переходить к изучению следующей главы. Что же можно создать с использованием изучаемых технологий? Давайте рассмотрим возможности этих технологий, а также предназначение глав книги. Язык разметки HTML, рассматриваемый в главе 1, позволяет задать местоположение элементов Web-страницы в окне Web-браузера. С помощью HTML можно отформатировать отдельные символы или целые фрагменты текста, вставить изображение, таблицу или форму, создать панель навигации с помощью карт-изображений, разделить окно Web-браузера на несколько областей, вставить гиперссылку и многое другое. При помощи каскадных таблиц стилей (CSS), о которых идет речь в главе 2, можно задавать точные характеристики практически всех элементов Webстраницы. Это позволяет контролировать внешний вид Web-страницы в окне Web-браузера и приближает возможности Web-дизайна к настольным издательским системам. У Web-страниц, созданных с использованием HTML и CSS, есть существенный недостаток — они являются статическими, то есть не могут меняться, реагируя на действия пользователя. Внедрение в HTML программ на языке JavaScript позволит «оживить» Web-страницу, сделать ее интерактивной, или, другими словами, заставить взаимодействовать с пользователем. С помощью

JavaScript можно обрабатывать данные формы до отправки на сервер, получать информацию о Web-браузере пользователя и его мониторе и соответствующим образом изменять форматирование страницы, создавать новые окна, изменять любые элементы HTML-документа в ответ на какое-либо событие, создавать часы на Web-странице, показывающие текущее время с точностью до секунды, скрывать и отображать элементы Web-страницы и многое другое. Как все это сделать, рассказано в главе 3. Еще большие возможности дает использование серверных технологий, среди которых для целей данной книги выбран язык программирования PHP. Это наиболее распространенный в настоящее время язык для написания серверных скриптов. Используя его (или другие технологии, применяемые для создания динамических Web-страниц), можно изменять HTML-код, получаемый Web-браузером, в зависимости от вводимых пользователем данных, типа и версии используемого Web-браузера и других факторов. Огромное количество расширений и готовых программных продуктов, а также легкость освоения языка сделали PHP очень популярным языком программирования для Интернета. С помощью PHP можно работать с файлами и каталогами, обрабатывать данные формы на сервере, рассылать письма, загружать файлы на сервер, создавать для каждого пользователя Личный кабинет, размещать на сайте гостевую книгу, форум, чат, интернет-магазин и многое другое. Писать программы на PHP мы научимся в главе 5. А в главе 4 рассказывается, как установить и настроить специальное программное обеспечение для тестирования скриптов на PHP. Это позволит изучить основные настройки программ и удалить все ошибки из скриптов до их загрузки на сервер. Ведь сайт может стать очень популярным, а посетителям не очень понравится увидеть вместо необходимой информации сообщение об ошибке. Кроме того, в главе 4 мы рассмотрим установку и настройку специализированных редакторов, которые позволяют значительно упростить создание сайта и сделают процесс изучения материала книги более эффективным. На сегодняшний день ни один крупный портал не обходится без использования баз данных. В Web-разработках чаще всего применяется быстрая, бесплатная и обладающая большими возможностями система управления базами данных (СУБД) MySQL. С помощью MySQL можно эффективно добавлять, изменять и удалять данные, получать нужную информацию по запросу. Использование MySQL обсуждается в главе 6. PHP обеспечивает эффективную поддержку баз данных и позволяет работать с MySQL, Microsoft SQL Server, Oracle, Sybase и др. Зная и умея работать с MySQL, легко перейти и к другим базам данных, если возникнет такая необходимость.

В главе 7 мы рассмотрим все проблемы, связанные с размещением сайта в Интернете. Мы узнаем, как подбирать подходящую площадку для сайта, научимся работать с FTP и командной строкой, произведем настройку сервера Apache, изучим возможность автоматического запуска программ в определенное время, подготовим сайт к индексации и т. д. На главе 7 наше знакомство с Web-технологиями не заканчивается. На прилагаемом компакт-диске вы найдете описание фильтров и преобразований, которые можно использовать в Web-браузере Internet Explorer, а также электронную версию самоучителя языка Perl. Кроме того, на компакт-диске расположено описание процесса создания динамического сайта с использованием всех изученных технологий. Мы создадим полноценный каталог сайтов, включающий личный кабинет для пользователей с защитой средствами PHP, а также личный кабинет для администратора, защищенный средствами сервера Apache. Создаваемые программы научат правильно обрабатывать данные формы и работать с базами данных. Все листинги из книги можно найти на прилагаемом компакт-диске. Настоятельно рекомендую обязательно рассматривать все примеры из книги и вначале самостоятельно набирать код. При наборе вы создадите множество ошибок. Именно умение находить эти ошибки сделает из вас настоящего Web-мастера. Ваши замечания и пожелания вы можете оставить в гостевой книге на сайте http://wwwadmin.ru/. Все замеченные опечатки прошу присылать на E-mail [email protected] Желаю приятного прочтения и надеюсь, что эта книга станет верным спутником в вашей повседневной жизни.

Основы HTML. Создаем дизайн сайта 1.1. Основные понятия HTML (HyperText Markup Language) — это язык разметки документа, описывающий форму отображения информации на экране компьютера. При создании документа часто приходится выделять какую-либо часть текста полужирным шрифтом, изменять размер или цвет шрифта, выравнивать текст по центру страницы и т. д. В текстовом редакторе для этого достаточно выделить нужный фрагмент и применить к нему форматирование. Например, чтобы пометить текст курсивом, нужно выделить его и нажать кнопку Курсив. На языке HTML тот же эффект достигается следующей строкой кода: Текст

Символ указывает, что текст надо выделить, начиная с этого места, а отмечает конец выделенного фрагмента. Символы и принято называть тегами. С помощью тегов описывается вся структура документа. Теги выделяются угловыми скобками «», между которыми указывается имя тега. Большинство тегов являются парными, так как есть открывающий тег () и соответствующий ему закрывающий (). Закрывающий тег отличается наличием косой черты («/») перед его именем. Есть также теги, вообще не имеющие закрывающего тега, например, тег переноса строки . Некоторые теги могут иметь параметры (иногда их называют атрибутами). Параметры указываются после имени тега через пробел в формате пара-

Если параметров несколько, то они перечисляются через пробел. Например:

В этом примере параметру http-equiv тега присвоено значение Conа параметру content — значение text/html; charset=windows-

Теги могут вкладываться друг в друга. Например:

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

П Р И МЕ Ч А Н И Е В HTML названия тегов и параметров можно записывать в любом регистре, а в языке XHTML только в нижнем регистре.

Просматривать HTML-документы можно с помощью специальных программ, которые называют Web-браузерами. Web-браузеры отображают документы с форматированием, выполненным на основе исходного кода, описывающего структуру документа. Результат интерпретации HTML-документа, отображаемый в окне Webбраузера, называется Web-страницей. В отличие от HTML-документа Webстраница может содержать не только текст, но и графику, видео, звуковое сопровождение, может реагировать на действия пользователя и т. д. Кроме того, Web-страница может быть результатом интерпретации сразу нескольких HTML-документов. Документы в формате HTML имеют расширение html или htm. Прежде чем изучать язык HTML, советую установить на компьютер один из редакторов — FCKeditor или tinyMCE. Эти редакторы написаны на языке программирования JavaScript и работают в Web-браузере. Скачать FCKeditor можно со страницы http://ckeditor.com/download. После распаковки архива запустите файл sample07.html (расположен в папке fckeditor\_samples\html\). Если вы используете Web-браузер Firefox, то для работы редактора необходимо выполнить следующие действия: 1. В адресной строке вводим about:config и нажимаем клавишу .

Илон Маск рекомендует:  Sqlглава 3 запросы с использованием нескольких таблиц

Основы HTML. Создаем дизайн сайта

2. Находим директиву security.fileuri.strict_origin_policy и двойным

щелчком на строке устанавливаем значение false. На рис. 1.1 можно увидеть, как выглядит редактор FCKeditor, запущенный в Web-браузере Firefox. Если вы раньше работали с текстовым редактором Microsoft Word, то большинство кнопок на панели инструментов будет вам знакомо. Принцип работы в FCKeditor точно такой же, как и в Word. После ввода текста и его форматирования редактор автоматически генерирует HTMLкод. Посмотреть исходный HTML-код можно нажав кнопку Источник на панели инструментов (рис. 1.2). Следует заметить, что при изменении исходного HTML-кода автоматически изменяется и внешний вид документа. Скачать tinyMCE можно со страницы http://tinymce.moxiecode.com/ download.php. После загрузки распаковываем архив в текущую папку. Для русификации редактора со страницы http://tinymce.moxiecode.com/ download_i18n.php необходимо скачать архив с файлами для русского языка. Архив следует разместить в папке tinymce\jscripts\tiny_mce\, а затем распаковать в текущую папку. Все файлы будут автоматически распределены по каталогам. Чтобы подключить поддержку русского языка, необходимо в файле full.html (расположен в папке tinymce\examples\) добавить строку language: «ru»,

сразу после строки tinyMCE.init(<

Рис. 1.1. Редактор FCKeditor, запущенный в Web-браузере Firefox

Теперь файл full.html открываем с помощью Web-браузера. На рис. 1.3 можно увидеть, как выглядит редактор tinyMCE, запущенный в Web-браузере Firefox.

Рис. 1.2. Результат нажатия кнопки Источник в редакторе FCKeditor

Рис. 1.3. Редактор tinyMCE, запущенный в Web-браузере Firefox

Основы HTML. Создаем дизайн сайта

1.2. Первый HTML-документ Попробуем создать наш первый HTML-документ. Для его создания можно воспользоваться любым текстовым редактором. Самым распространенным редактором является обычный Блокнот. Открываем Блокнот и набираем содержимое листинга 1.1. Листинг 1.1. Первый HTML-документ Заголовок страницы

Этот текст выделен полужирным шрифтом

Сохраняем введенный текст в формате HTML, например, под именем test.html. Для этого в меню Файл выбираем пункт Сохранить как. В открывшемся окне в строке Имя файла вводим «test.html», а в списке Тип файла указываем Все файлы. Выбираем папку, например, Рабочий стол, и нажимаем Сохранить. Закрываем Блокнот. П Р И МЕ Ч А Н И Е Если в списке Тип файла оставить Текстовые документы (*.txt), то в строке Имя файла название файла необходимо заключить в кавычки, иначе к имени файла будет добавлено расширение txt.

Запускаем Web-браузер, например, Internet Explorer. С помощью пункта Открыть меню Файл открываем сохраненный файл test.html. Если все сделано правильно, то в окне Web-браузера будет показана выделенная надпись «Этот

текст выделен полужирным шрифтом», а в строке заголовка будет надпись «Заголовок страницы — Microsoft Internet Explorer». Теги в окне Webбраузера не отображаются! Теперь попробуем изменить заголовок в окне Web-браузера. Для этого необходимо открыть исходный текст в формате HTML. Это можно сделать тремя способами: в меню Вид выбрать пункт Просмотр HTML-кода; правой кнопкой мыши щелкнуть в любом месте окна Web-браузера. В появившемся контекстном меню выбрать пункт Просмотр HTMLкода; П Р И МЕ Ч А Н И Е В некоторых случаях результат этих двух действий может быть разным. Если Web-страница состоит из нескольких HTML-документов, то первый способ отобразит только код структуры Web-страницы, а не исходный код каждого из HTML-документов. Второй способ позволяет отобразить исходный код лишь одного HTML-документа, а от места щелчка зависит, код какого HTML-документа будет отображен. В нашем случае результат будет одним и тем же.

открыть файл, содержащий исходный код, с помощью Блокнота или другого текстового редактора. Этот способ является самым универсальным. Настоятельно рекомендую использовать именно его. В итоге исходный текст будет доступен для редактирования. Изменим строчку Заголовок страницы

на Моя первая Web-страница

и сохраним файл (меню Файл, пункт Сохранить). Теперь вернемся в Webбраузер и обновим Web-страницу. Обновить можно следующими способами: в меню Вид выбрать пункт Обновить; выбрать этот же пункт в контекстном меню; нажать кнопку Обновить на Панели инструментов; на клавиатуре нажать клавишу . В результате строка заголовка изменится на «Моя первая Web-страница — Microsoft Internet Explorer».

Основы HTML. Создаем дизайн сайта

Таким образом, изменяя что-либо в исходном коде, можно визуально оценивать результаты произведенных действий. Алгоритм такой: открываем исходный код, вносим корректировку, сохраняем, а затем обновляем Webстраницу. П Р И МЕ Ч А Н И Е Необходимо заметить, что все описанные действия возможны только для локально сохраненных HTML-документов. Если HTML-документ опубликован в Интернете, то можно лишь созерцать исходный код, а вот изменить его таким способом нельзя.

Очень хорошей альтернативой Блокноту является программа Notepad++. Она позволяет корректно работать как с кодировкой windows-1251, так и с кодировкой UTF-8, а также имеет подсветку синтаксиса HTML, JavaScript, PHP и др. Именно этой программой мы будем пользоваться на протяжении всей книги. Скачать программу Notepad++ можно абсолютно бесплатно со страницы http://notepad-plus.sourceforge.net/ru/site.htm. Из двух вариантов (ZIP-архив и инсталлятор) советую выбрать именно инсталлятор, так как при установке можно будет указать язык интерфейса программы. Установка Notepad++ предельно проста и в комментариях не нуждается. Запускаем программу Notepad++. В меню Кодировки устанавливаем флажок Кодировать в ANSI. Набираем код, представленный в листинге 1.1, а затем в меню Файл выбираем пункт Сохранить как. В открывшемся окне в строке Имя файла вводим «test.html». Выбираем папку, например, Рабочий стол, и нажимаем Сохранить. Для просмотра открываем файл с помощью Webбраузера. Чтобы открыть какой-либо файл на редактирование, в меню Файл выбираем пункт Открыть или щелкаем правой кнопкой мыши на ярлыке файла в Проводнике Windows и из контекстного меню выбираем пункт Edit with Notepad++. П Р И МЕ Ч А Н И Е Вместо Notepad++ можно воспользоваться редакторами PHP Expert Editor, Aptana Studio или NetBeans. Эти редакторы помимо подсветки синтаксиса предоставляют множество дополнительных функций. Тем не менее для быстрого редактирования файла удобнее пользоваться Notepad++. Описание редакторов вы найдете в главе 4.

1.3. Структура документа Итак, мы изучили технологию создания HTML-документов, научились сохранять, отображать и изменять исходный код. Пришла пора вернуться к языку HTML. В листинге 1.2 представлена структура, характерная для любого HTML-документа. Листинг 1.2. Структура HTML-документа

Тег позволяет определить Web-браузеру формат файла и правильно отобразить все его инструкции. Допустимые форматы для HTML 4.01: Strict — строгий формат. Не содержит тегов и параметров, помеченных как устаревшие или не одобряемые. Объявление формата:

— переходный формат. Содержит устаревшие теги в целях совместимости и упрощения перехода со старых версий HTML. Объявление формата: Transitional

Frameset — аналогичен переходному формату, но содержит также теги для создания фреймов. Объявление формата:

Если тег не указан, то Web-браузер Internet Explorer переходит в режим совместимости (Quirks Mode). В этом режиме отличается тип блочной

Основы HTML. Создаем дизайн сайта

модели. Поэтому при отсутствии тега разные Web-браузеры могут по-разному отображать Web-страницу. П Р И МЕ Ч А Н И Е Более подробную информацию о типах блочной модели можно получить в Интернете на странице консорциума W3C http://www.w3.org/TR/CSS2/ box.html и на странице http://www.quirksmode.org/css/quirksmode.html.

Весь текст HTML-документа расположен между тегами и . HTML-документ состоит из двух разделов — заголовка (между тегами и ) и содержательной части (между тегами и ).

1.3.1. Раздел HEAD. Техническая информация о документе Раздел HEAD содержит техническую информацию о странице — заголовок, ее описание и ключевые слова для поисковых машин, данные об авторе и времени создания страницы, базовом адресе страницы, кодировке и т. д. Единственным обязательным тегом в разделе HEAD является тег . Текст, расположенный между и , отображается в строке заголовка Web-браузера. Длина заголовка должна быть не более 60 символов, иначе он полностью не поместится в заголовке Web-браузера: Заголовок страницы

СОВЕТ Очень часто текст между тегами и используется в результатах, выдаваемых поисковым порталом, в качестве текста ссылки на эту страницу. По этой причине заголовок должен максимально полно описывать содержание страницы. Не следует писать что-то вроде «Главная страница», «Первая страница» и т. п.

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

Можно также указать несколько описаний на разных языках. Для этого в параметре lang следует указать используемый язык:

Кроме того, тег позволяет запретить или разрешить индексацию Webстраницы поисковыми машинами:

В параметре content указывается комбинация следующих значений: index

follow — разрешено переходить по ссылкам, которые находятся на этой Web-странице; nofollow all

— запрещено переходить по ссылкам;

— комбинация index плюс follow;

— комбинация noindex плюс nofollow.

Приведем ряд примеров. Индексация и переход по ссылкам разрешены:

Индексация разрешена, а переход по ссылкам запрещен:

Индексация и переход по ссылкам запрещены:

Также с помощью тега можно указать кодировку текста:

Для автоматической перезагрузки страницы через заданный промежуток времени следует воспользоваться свойством refresh тега :

В этом примере страница будет перезагружена через 30 секунд. Если необходимо сразу перебросить посетителя на другую страницу, то можно указать URL-адрес в параметре url:

Основы HTML. Создаем дизайн сайта

П Р И МЕ Ч А Н И Е В разделе HEAD могут быть расположены также теги , , , и некоторые другие. Эти теги мы рассмотрим по мере изучения материала.

1.3.2. Раздел BODY. Основная часть документа В этом разделе располагается все содержимое документа. Большинство тегов, рассмотренных в этой главе книги, должны находиться именно между тегами и . Следует отметить, что в формате Strict содержимое тега должно быть расположено внутри блочных элементов, например,

Тег имеет следующие параметры: bgcolor задает цвет фона Web-страницы. Даже если цветом фона является белый, все равно следует указать цвет.

Цвет определяется цифрами в шестнадцатеричном коде. Для каждой составляющей цвета (красного, зеленого и синего) задается значение в пределах от 00 до FF. Эти значения объединяются в одно число, перед которым добавляется символ «#», например, значение #FF0000 соответствует красному цвету, #00FF00 — ярко-зеленому, а #FF00FF — фиолетовому (смеси красного и синего); background позволяет задать фоновый рисунок для документа путем указания URL-адреса изображения; alink link

устанавливает цвет еще не просмотренных ссылок;

определяет цвет активной ссылки; определяет цвет уже просмотренных ссылок;

устанавливает цвет текста.

Например, тег может выглядеть так:

16 Заголовок страницы

О Б Р А Т И Т Е В Н И МА Н И Е Все рассмотренные в этом разделе параметры являются устаревшими и поддерживаются только в формате Transitional. Использование в формате Strict недопустимо.

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

1.4. Форматирование отдельных символов Как уже говорилось, HTML — это язык разметки. Следовательно, важно уметь форматировать отдельные символы, а также целые фрагменты текста. Но прежде чем изучать теги, рассмотрим возможность отображения специальных символов. Такими символами, например, являются знаки меньше (), так как с помощью этих символов описываются HTML-теги. Для отображения специальных символов используются так называемые HTML-эквиваленты. Например, для вывода такого текста Текст между тегами и используется в результатах, выдаваемых поисковым порталом.

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

В этом примере мы заменили знак меньше () — на >. Перечислим наиболее часто используемые HTML-эквиваленты:

Следующие параметры доступны только при использовании формата Transitional: align задает выравнивание таблицы, а также обтекание таблицы текстом. Он может принимать следующие значения:

— таблица выравнивается по левому краю, а текст обтекает ее справа: left

— таблица выравнивается по правому краю, а текст обтекает ее

— таблица выравнивается по центру:

указывает цвет фона таблицы:

1.9.2. Заголовок таблицы Тег позволяет задать заголовок таблицы. Он имеет единственный параметр align. Этот параметр может принимать одно из двух значений: top

— заголовок помещается над таблицей:

Заголовок таблицы bottom

— заголовок располагается под таблицей:

О Б Р А Т И Т Е В Н И МА Н И Е Параметр align является устаревшим и поддерживается только в формате Transitional. Использование в формате Strict недопустимо.

HTML, JavaScript, PHP и MySQL: Джентльменский набор Web-мастера. 4-е изд.

Обзор

Рассмотрены вопросы создания интерактивных Web-сайтов с помощью HTML, JavaScript, PHP и MySQL, форматирования Web-страниц при помощи CSS. Даны основы PHP и примеры написания типичных сценариев. Описаны приемы работы и администрирования баз данных MySQL при помощи PHP и программы phpMyAdmin. Особое внимание уделено созданию программной среды на компьютере разработчика и настройке Web-сервера Apache. Приведено описание текстового редактора Notepad++, шаблонизатора Smarty и прочих программ (Aptana Studio, NetBeans и HeidiSQL), необходимых Web-разработчику.
В 4-м издании содержится описание возможностей, предлагаемых HTML5 (средства семантической разметки и размещения аудио и видео) и CSS 3 (градиенты, создание тени, анимация и преобразования), технологии AJAX, формата JSON, новых инструментов JavaScript (включая средства геолокации и локальное хранилище данных) и всех нововведений, появившихся в актуальных на данный момент версиях Apache, PHP и MySQL.
Электронный архив содержит листинги примеров, руководство по созданию динамического сайта, самоучитель языка Perl, руководство по публикации сайта, инструкции по установке дополнительных программ и видеоуроки.

Читайте в мобильном приложении Scribd

Похожие

Похоже на «Книги»

Отрывок книги

HTML, JavaScript, PHP и MySQL — Николай Прохоренок

Прохоренок, Н. А.

П84 HTML, JavaScript, PHP и MySQL. Джентльменский набор Web-мастера. — 4-е изд., перераб. и доп. / Н. А. Прохоренок, В. А. Дронов. — СПб.: БХВ-Петербург, 2015. — 768 с.: ил. — (Профессиональное программирование)

Рассмотрены вопросы создания интерактивных Web-сайтов с помощью HTML, JavaScript, PHP и MySQL, форматирования Web-страниц при помощи CSS. Даны основы PHP и примеры написания типичных сценариев. Описаны приемы работы и администрирования баз данных MySQL при помощи PHP и программы phpMyAdmin. Особое внимание уделено созданию программной среды на компьютере разработчика и настройке Web-сервера Apache. Приведено описание текстового редактора Notepad++, шаблонизатора Smarty и прочих программ (Aptana Studio, NetBeans и HeidiSQL), необходимых Web-разработчику.

В 4-м издании содержится описание возможностей, предлагаемых HTML5 (средства семантической разметки и размещения аудио и видео) и CSS 3 (градиенты, создание тени, анимация и преобразования), технологии AJAX, формата JSON, новых инструментов JavaScript (включая средства геолокации и локальное хранилище данных) и всех нововведений, появившихся в актуальных на данный момент версиях Apache, PHP и MySQL.

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

Группа подготовки издания:

Главный редактор Екатерина Кондукова

Зам. главного редактора Евгений Рыбаков

Зав. редакцией Екатерина Капалыгина

Редактор Леонид Кочин

Корректор Зинаида Дмитриева

Дизайн серии Инны Тачиной

Оформление обложки Марины Дамбиевой

© Прохоренок Н. А., Дронов В. А., 2015

© Оформление, издательство БХВ-Петербург , 2015

Оглавление

Введение

Глава 1. Основы HTML. Создаем дизайн сайта

1.1. Основные понятия

1.2. Первый HTML-документ

1.3. Структура документа

1.3.1. Раздел HEAD. Техническая информация о документе

1.3.2. Раздел BODY. Основная часть документа

1.4. Форматирование отдельных символов

1.4.1. Выделение фрагментов текста

1.4.2. Создание нижних и верхних индексов

1.4.3. Вывод текста заданным шрифтом

1.5. Форматирование документа

1.5.1. Тег комментария

1.5.2. Перевод строки

1.5.3. Горизонтальная линия

1.5.5. Разделение на абзацы

1.6.1. Маркированные списки

1.6.2. Нумерованные списки

1.6.3. Списки определений

1.7.1. Изображение на Web-странице

1.7.2. Изображение в качестве фона

1.8.1. Внешние гиперссылки

1.8.2. Внутренние гиперссылки

1.8.3. Гиперссылки на адрес электронной почты

1.9.1. Вставка таблицы в документ

1.9.2. Заголовок таблицы

1.9.3. Строки таблицы

1.9.4. Ячейки таблицы

1.10.1. Разделение окна Web-браузера на несколько областей

1.10.2. Структура HTML-документа, содержащего фреймы

1.10.3. Описание фреймовой структуры

1.10.4. Описание отдельных областей

1.10.6. Загрузка документа в определенный фрейм

1.11.1. Карта-изображение как панель навигации

1.11.2. Структура карт-изображений

1.11.4. Описание активной области на карте-изображении

1.12.1. Создание формы для регистрации сайта

1.12.2. Структура документа с формами

1.12.3. Добавление формы в документ

1.12.4. Описание элементов управления

1.12.6. Группировка элементов формы

1.14. Отличия XHTML 1.0 от HTML 4.01

1.15. Проверка HTML-документов на соответствие стандартам

1.16. Специальный тег в Web-браузере Internet Explorer

1.17.1. Требования к страницам, написанным на HTML5

1.17.2. Семантическая разметка

1.17.4. Новые возможности форм и элементов управления


1.17.5. Прочие нововведения

1.17.6. Теги и параметры, объявленные устаревшими

Глава 2. Основы CSS. Форматируем Web-страницу с помощью стилей

2.1. Основные понятия

2.2. Способы встраивания определения стиля

2.2.1. Встраивание определения стиля в тег

2.2.2. Встраивание определения стилей в заголовок HTML-документа

2.2.3. Вынесение таблицы стилей в отдельный файл

2.2.4. Приоритет применения стилей

2.3. Единицы измерения в CSS

2.4. Форматирование шрифта

2.4.2. Стиль шрифта

2.4.3. Размер шрифта

2.4.4. Цвет шрифта

2.4.5. Жирность шрифта

2.5. Форматирование текста

2.5.1. Расстояние между символами в словах

2.5.2. Расстояние между словами

2.5.3. Отступ первой строки

2.5.4. Вертикальное расстояние между строками

2.5.5. Горизонтальное выравнивание текста

2.5.6. Вертикальное выравнивание текста

2.5.7. Подчеркивание, надчеркивание и зачеркивание текста

2.5.8. Изменение регистра символов

2.5.9. Обработка пробелов между словами

2.6.1. Внешние отступы

2.6.2. Внутренние отступы

2.7.1. Стиль линии рамки

2.7.2. Толщина линии рамки

2.7.3. Цвет линии рамки

2.7.4. Одновременное задание атрибутов рамки

2.8. Фон элемента

2.8.2. Фоновый рисунок

2.8.3. Режим повтора фонового рисунка

2.8.4. Прокрутка фонового рисунка

2.8.5. Положение фонового рисунка

2.8.6. Одновременное задание атрибутов фона

2.9.1. Вид маркера списка

2.9.2. Изображение в качестве маркера списка

2.9.3. Компактное отображение списка

2.10. Вид курсора

2.11. Псевдостили гиперссылок. Отображение ссылок разными цветами

2.12. Форматирование блоков

2.12.1. Указание типа блока

2.12.2. Установка размеров

2.12.3. Атрибут overflow

2.12.4. Управление обтеканием

2.12.5. Позиционирование блока

2.12.6. Последовательность отображения слоев

2.13. Управление отображением элемента

2.14.1. Новые селекторы

2.14.2. Новые единицы измерения размеров и способы задания цвета

2.14.3. Параметры фона

2.14.4. Рамки со скругленными углами

2.14.5. Параметры таблиц

2.14.6. Параметры тени

2.14.7. Загружаемые шрифты

2.14.8. Режимы установки размеров

2.14.9. Градиентные фоны

2.14.10. Анимация с двумя состояниями

2.14.11. Анимация с несколькими состояниями

2.14.12. Двумерные преобразования

2.14.13. Трехмерные преобразования

2.15. Проверка CSS-кода на соответствие стандартам

Глава 3. Основы JavaScript. Создаем страницы, реагирующие на действия пользователей

3.1. Основные понятия

3.2. Первая программа на JavaScript

3.3. Комментарии в JavaScript

3.4. Вывод результатов работы программы и ввод данных

3.4.1. Окно с сообщением и кнопкой OK

3.4.2. Окно с сообщением и кнопками OK и Cancel

3.4.3. Окно с полем ввода и кнопками OK и Cancel

3.6. Типы данных и инициализация переменных. Определение типа данных переменной

3.7. Операторы JavaScript

3.7.1. Математические операторы

3.7.2. Операторы присваивания

3.7.3. Двоичные операторы

3.7.4. Оператор обработки строк

3.7.5. Приоритет выполнения операторов

3.8. Преобразование типов данных

3.9. Специальные символы. Разбиение сообщения в диалоговом окне на несколько строк

3.11. Функции. Разделение программы на фрагменты

3.11.1. Основные понятия

3.11.2. Расположение функций внутри HTML-документа

3.11.3. Рекурсия. Вычисление факториала

3.11.4. Глобальные и локальные переменные

3.12. Условные операторы. Выполнение блоков кода только при соответствии условию

3.12.1. Операторы сравнения

3.12.2. Оператор ветвления if. else. Проверка ввода пользователя

3.12.3. Оператор ? Проверка числа на четность

3.12.4. Оператор выбора switch

3.13. Операторы циклов. Многократное выполнение блока кода

3.13.2. Цикл while

3.13.3. Цикл do. while

3.13.4. Оператор continue. Переход на следующую итерацию цикла

3.13.5. Оператор break. Прерывание цикла

3.14. Ошибки в программе

3.14.1. Синтаксические ошибки

3.14.2. Логические ошибки

3.14.3. Ошибки времени выполнения

3.14.4. Обработка ошибок

3.14.5. Модуль Firebug для Web-браузера Firefox

3.15. Встроенные классы JavaScript

3.15.1. Основные понятия

3.15.2. Класс Global

3.15.3. Класс Number. Работа с числами

3.15.4. Класс String. Обработка строк

3.15.5. Класс Array. Работа с массивами и их сортировка

3.15.6. Класс Math. Использование математических функций

3.15.7. Класс Date. Получение текущей даты и времени. Вывод даты и времени в окне Web-браузера

3.15.8. Класс Function (функции)

3.15.9. Класс Arguments. Функции с произвольным количеством аргументов

3.15.10. Класс RegExp. Проверка значений с помощью регулярных выражений

3.16.1. Основные понятия

3.16.2. События мыши

3.16.3. События клавиатуры

3.16.4. События документа

3.16.5. События формы

3.16.6. Последовательность событий

3.16.7. Всплывание событий

3.16.8. Действия по умолчанию и их отмена

3.16.9. Написание обработчиков событий

3.16.10. Объект event. Вывод координат курсора и кода нажатой клавиши. Вывод сообщений при нажатии комбинации клавиш

3.17. Объектная модель Microsoft Internet Explorer

3.17.1. Структура объектной модели

3.17.2. Объект window. Вывод сообщения в строку состояния Web-браузера

3.17.3. Работа с окнами. Создание нового окна без строки меню, адресной строки и панели инструментов

3.17.4. Модальные диалоговые окна. Использование модальных окон вместо встроенных диалоговых окон

3.17.5. Таймеры. Создание часов на Web-странице

3.17.6. Объект navigator. Получение информации о Web-браузере пользователя. Перенаправление клиента на разные страницы в зависимости от Web-браузера

3.17.7. Объект screen. Получение информации о мониторе пользователя

3.17.8. Объект location. Разбор составляющих URL-адреса документа. Создание многостраничных HTML-документов

3.17.9. Объект history. Получение информации о просмотренных страницах. Реализация перехода на предыдущую просмотренную страницу

3.17.10. Объект document. Получение полной информации о HTML-документе

3.17.11. Обращение к элементам документа. Выравнивание заголовков по центру

3.17.12. Работа с элементами документа. Изменение URL-адреса и текста ссылки. Преобразование ссылки в обычный текст

3.17.13. Объект style. Работа с таблицами стилей при помощи JavaScript

3.17.14. Объект selection. Проверка наличия выделенного фрагмента

3.17.15. Объект TextRange. Поиск фрагмента в текстовом поле или документе. Расширение или сжатие выделенного фрагмента текста

3.17.16. Работа с буфером обмена. Выделение фрагмента от позиции щелчка до конца документа и копирование его в буфер обмена

3.17.17. Реализация ссылок Добавить сайт в Избранное и Сделать стартовой страницей

3.17.18. Сохранение данных на компьютере клиента. Определение возможности использования cookies. Сохранение русского текста в cookies

3.18. Работа с элементами формы

3.18.1. Элементы управления

3.18.2. Коллекция Forms. Доступ к элементу формы из скрипта

3.18.3. Свойства объекта формы

3.18.4. Методы объекта формы

3.18.5. События объекта формы

3.18.6. Текстовое поле и поле ввода пароля. Проверка правильности ввода E-mail и пароля. Получение данных из элемента формы

3.18.7. Поле для ввода многострочного текста. Добавление слов из текстового поля в поле

3.18.8. Список с возможными значениями. Возможность добавления нового пункта. Применение списков вместо гиперссылок

3.18.9. Флажок и переключатели. Получение значения выбранного переключателя при помощи цикла и проверка установки флажка

3.18.10. Кнопки. Обработка нажатия кнопки. Деактивация кнопки. Создание клавиши быстрого доступа и вывод текста на кнопке определенным цветом

3.18.11. Проверка корректности данных. Создание формы регистрации пользователя

3.19. Пользовательские объекты

3.19.1. Создание объектов

3.19.3. Пространства имен

3.20.1. Подготовка к загрузке данных

3.20.2. Отправка запроса

3.20.3. Получение данных

3.20.4. Формат JSON

3.21.1. Обращение к элементам страницы

3.21.2. Управление содержимым страницы

3.21.3. Обработка событий

3.21.4. Работа с формами и элементами управления

3.21.5. Работа с графическими изображениями

3.21.6. Работа с мультимедиа

3.21.7. Канва HTML5. Программируемая графика

3.21.9. Средства геолокации

Глава 4. Программное обеспечение Web-сервера. Устанавливаем и настраиваем программы под Windows

4.1. Необходимые программы

4.2. Установка, настройка и запуск сервера Apache

4.2.1. Настройка сервера Apache

4.2.2. Запуск и останов Apache

4.2.3. Установка Apache как службы Windows

4.3. Структура каталогов сервера Apache

4.4. Файл конфигурации httpd.conf

4.4.1. Основные понятия

4.4.2. Разделы файла конфигурации

4.4.3. Общие директивы. Создание домашнего каталога пользователя, доступного при запросе http://localhost/

4.4.4. Переменные сервера и их использование

4.4.5. Директивы управления производительностью

4.4.6. Директивы обеспечения постоянного соединения

4.4.7. Директивы работы с языками

4.4.8. Директивы перенаправления

4.4.9. Обработка ошибок

4.4.10. Настройки MIME-типов

4.4.11. Управление листингом каталога

4.4.12. Директивы протоколирования

4.4.13. Файл конфигурации .htaccess. Управляем сервером Apache из обычной папки

4.4.14. Защита содержимого папки паролем

4.4.15. Управление доступом

4.4.16. Регулярные выражения, используемые в директивах

4.4.17. Создание виртуальных серверов

4.5. Установка PHP

4.6. Установка MySQL

4.7. Установка phpMyAdmin

Глава 5. Основы PHP. Создаем динамические Web-страницы

5.1. Основные понятия

5.2. Первая программа на PHP

5.2.1. Особенности создания скриптов в кодовой таблице UTF-8

5.3. Методы встраивания PHP-кода

5.4. Комментарии в PHP-сценариях

5.5. Вывод результатов работы скрипта

5.7. Типы данных и инициализация переменных

5.8. Проверка существования переменной

5.9. Удаление переменной

5.10. Константы. Создание и использование констант

5.11. Операторы PHP

5.11.1. Математические операторы

5.11.2. Операторы присваивания

5.11.3. Двоичные операторы

5.11.4. Оператор конкатенации строк. Подстановка значений переменных.Запуск внешних программ

5.11.5. Приоритет выполнения операторов

5.12. Преобразование типов данных

5.13. Специальные символы

5.14.1. Инициализация массива

5.14.2. Получение и изменение элемента массива. Определение числа элементов массива

5.14.3. Многомерные массивы

5.14.4. Ассоциативные массивы

5.14.5. Слияние массивов

5.14.6. Перебор элементов массива

5.14.7. Добавление и удаление элементов массива


5.14.8. Переворачивание и перемешивание массива

5.14.9. Сортировка массива. Создание пользовательской сортировки

5.14.10. Получение части массива

5.14.11. Преобразование переменных в массив

5.14.12. Преобразование массива в переменные

5.14.13. Заполнение массива числами

5.14.14. Преобразование массива в строку

5.14.15. Проверка наличия значения в массиве

5.15.1. Функции для работы со строками

5.15.2. Настройка локали

5.15.3. Функции для работы с символами

5.15.4. Поиск и замена в строке

5.15.5. Функции для сравнения строк

5.15.6. Кодирование строк

5.15.7. Преобразование кодировок

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

5.15.9. Perl-совместимые регулярные выражения

5.15.10. Функции для работы со строками в кодировке UTF-8

5.15.11. Перегрузка строковых функций

5.16. Функции для работы с числами

5.17. Функции для работы с датой и временем. Получение текущей даты, даты создания файла и проверка корректности введенной даты

5.18. Функции. Разделение программы на фрагменты

5.18.1. Основные понятия

5.18.2. Расположение описаний функций

5.18.3. Операторы require и include. Выносим функции в отдельный файл. Создаем шаблоны для множества страниц

5.18.4. Операторы require_once и include_once

5.18.5. Рекурсия. Вычисляем факториал

5.18.6. Глобальные и локальные переменные. Использование глобальных переменных внутри функций

5.18.7. Статические переменные

5.18.8. Переменное число параметров в функции. Сумма произвольного количества чисел

5.19. Условные операторы. Выполнение блоков кода только при соответствии условию

5.19.1. Операторы сравнения

5.19.2. Оператор ветвления if. else. Проверка выбранного элемента из списка

5.19.3. Оператор ? Проверка числа на четность

5.19.4. Оператор выбора switch. Использование оператора switch вместо if. else

5.20. Операторы циклов. Многократное выполнение блока кода

5.20.2. Цикл while

5.20.3. Цикл do. while

5.20.4. Цикл foreach

5.20.5. Оператор continue. Переход на следующую итерацию цикла

5.20.6. Оператор break. Прерывание цикла

5.21. Завершение выполнения сценария. Навигация при выборе значения из списка

5.22. Ошибки в программе

5.22.1. Синтаксические ошибки

5.22.2. Логические ошибки

5.22.3. Ошибки времени выполнения

5.22.4. Обработка ошибок

5.22.5. Инструкция or die()

5.23. Переменные окружения

5.23.1. Суперглобальные массивы

5.23.2. Часто используемые переменные окружения

5.24. Заголовки HTTP

5.24.1. Основные заголовки

5.24.2. Функции для работы с заголовками. Перенаправление клиента на другой URL-адрес. Запрет кэширования страниц. Реализация ссылки Скачать. Просмотр заголовков, отправляемых сервером

5.24.3. Работа с cookies. Создаем индивидуальный счетчик посещений

5.25. Работа с файлами и каталогами

5.25.1. Основные понятия

5.25.2. Функции для работы с файлами. Создание файла, запись в файл, вывод содержимого файла в список

5.25.3. Перемещение внутри файла

5.25.4. Создание списка рассылки с возможностью добавления, изменения и удаления E-mail-адресов

5.25.5. Чтение CSV-файлов. Преобразование CSV-файла в HTML-таблицу

5.25.6. Права доступа в операционной системе UNIX

5.25.7. Функции для манипулирования файлами

5.25.8. Загрузка файлов на сервер

5.25.9. Функции для работы с каталогами. Создаем программу для просмотра всех доступных каталогов и файлов на диске

5.25.10. Получение информации из сети Интернет

5.26. Отправка писем с сайта. Рассылка писем по E-mail-адресам из файла

5.27. Аутентификация с помощью PHP. Создание Личного кабинета

5.28. Работа с графикой

5.28.1. Информация об установленной библиотеке GD

5.28.2. Получение информации об изображении

5.28.3. Работа с готовыми изображениями

5.28.4. Создание нового изображения

5.28.5. Работа с цветом

5.28.6. Рисование линий и фигур

5.28.7. Вывод текста в изображение. Создаем счетчик посещений

5.28.8. Изменение размеров и копирование изображений

5.29. Обработка данных формы

5.29.1. Текстовое поле, поле ввода пароля и скрытое поле

5.29.2. Поле для ввода многострочного текста

5.29.3. Список с возможными значениями

5.29.6. Кнопка Submit

5.29.7. Проверка корректности данных. Создание формы регистрации пользователя

5.30. Другие полезные функции

5.30.1. Выделение фрагментов исходного кода

5.30.2. Получение информации об интерпретаторе

5.30.3. Вывод всех доступных сценарию функций

5.30.4. Засыпание сценария

5.30.5. Изменение значения директив во время выполнения сценария

5.30.6. Выполнение команд, содержащихся в строке

5.31. Объектно-ориентированное программирование

5.31.1. Создание класса

5.31.2. Конструктор и деструктор

5.31.4. Статические свойства и методы

5.31.5. Объявление констант внутри класса

5.31.6. Определение области видимости

5.31.7. Абстрактные классы и методы

5.31.9. Оператор проверки типа instanceof

5.31.10. Создание шаблона сайта при помощи класса

5.32. Поддержка AJAX со стороны сервера. Кодирование данных в формате JSON

5.33. Шаблонизатор Smarty

5.33.1. Установка и настройка

5.33.2. Управляющие конструкции

5.33.3. Модификаторы переменных

5.33.4. Кэширование страниц

Глава 6. Основы MySQL. Работаем с базами данных

6.1. Основные понятия

6.2. Нормализация базы данных

6.3. Типы данных полей

6.3.1. Числовые типы

6.3.2. Строковые типы

6.3.3. Дата и время

6.4. Основы языка SQL

6.4.1. Создание базы данных

6.4.2. Создание пользователя базы данных

6.4.3. Создание таблицы

6.4.4. Добавление данных в таблицу

6.4.5. Обновление записей

6.4.6. Удаление записей из таблицы

6.4.7. Изменение структуры таблицы

6.4.8. Выбор записей

6.4.9. Выбор записей из нескольких таблиц

6.4.10. Индексы. Ускорение выполнения запросов

6.4.11. Удаление таблицы и базы данных

6.5. Доступ к базе данных из PHP с помощью библиотеки php_mysql.dll

6.5.1. Установка соединения

6.5.2. Выбор базы данных

6.5.3. Выполнение запроса к базе данных

6.5.4. Обработка результата запроса

6.6. Доступ к базе данных из PHP с помощью библиотеки php_mysqli.dll

6.6.1. Установка соединения

6.6.2. Выбор базы данных

6.6.3. Выполнение запроса к базе данных

6.6.4. Обработка результата запроса

6.7. Операторы MySQL

6.7.1. Математические операторы

6.7.2. Двоичные операторы

6.7.3. Операторы сравнения

6.7.4. Приоритет выполнения операторов

6.7.5. Преобразование типов данных

6.8. Поиск по шаблону

6.9. Поиск с помощью регулярных выражений

6.9.1. Метасимволы, используемые в регулярных выражениях

6.10. Режим полнотекстового поиска

6.10.1. Создание индекса FULLTEXT

6.10.2. Реализация полнотекстового поиска

6.10.3. Режим логического поиска

6.10.4. Поиск с расширением запроса

6.11. Функции MySQL

6.11.1. Функции для работы с числами

6.11.2. Функции даты и времени

6.11.3. Функции для обработки строк

6.11.4. Функции для шифрования строк

6.11.5. Информационные функции

6.11.6. Прочие функции

6.12. Переменные SQL

6.13. Временные таблицы

6.14. Вложенные запросы

6.14.1. Заполнение таблицы с помощью вложенного запроса

6.14.2. Применение вложенных запросов в инструкции WHERE

6.14.3. Применение вложенных запросов в инструкции FROM

6.15. Внешние ключи

6.16.1. Запуск, подтверждение и отмена транзакций

6.16.2. Изоляция транзакций

6.16.3. Автозавершение транзакций и его отключение

6.16.4. Поддержка транзакций библиотекой php_mysqli.dll

Приложение. Описание электронного архива

Введение

Если вы хотите научиться своими руками создавать сайты, свободно владеть HTML, CSS, JavaScript, PHP и MySQL, то эта книга для вас. Большинство подобных книг предлагают изучение или только клиентских технологий (HTML, CSS, JavaScript), или только серверных (PHP, MySQL). Но разделять эти инструменты нельзя, т. к. они могут существовать только совместно, а значит, и изучать их нужно как единое целое.

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

Что же можно создать с использованием описываемых технологий? Давайте кратко рассмотрим возможности этих технологий, а также содержание глав книги.

Язык разметки HTML, рассматриваемый в главе 1, позволяет задать местоположение элементов Web-страницы в окне Web-браузера. С помощью HTML можно отформатировать отдельные символы или целые фрагменты текста, вставить изображение, таблицу или форму, создать панель навигации с помощью карт-изображений, разделить окно Web-браузера на несколько областей, вставить гиперссылку и многое другое. А новая версия языка HTML — HTML5 — даже позволяет поместить на страницу аудио- или видеоролик, который будет воспроизводиться самим Web-браузером, без необходимости устанавливать какие бы то ни было плагины.

При помощи каскадных таблиц стилей (CSS), о которых идет речь в главе 2, можно задавать точные характеристики практически всех элементов Web-страницы. Это позволяет контролировать внешний вид Web-страницы в окне Web-браузера и приближает возможности Web-дизайна к настольным издательским системам. Разработчик может указать параметры шрифта, цвет текста и фона, выравнивание, создать рамку и расположить элементы на странице произвольным образом. Новая версия CSS — CSS 3 — также предоставляет инструменты для задания градиентного фона, теней у текста и самого элемента страницы и даже для создания анимации.

У Web-страниц, созданных с использованием HTML и CSS, есть существенный недостаток — они являются статическими, т. е. не могут меняться, реагируя на действия пользователя. Внедрение программ, написанных на языке JavaScript, в HTML-код позволит оживить Web-страницу, сделать ее интерактивной или, другими словами, заставить взаимодействовать с пользователем. С помощью JavaScript можно обрабатывать данные формы до отправки на сервер, получать информацию о Web-браузере пользователя и его мониторе и соответствующим образом менять форматирование страницы, создавать новые окна, изменять любые элементы HTML-документа в ответ на какое-либо событие, создавать часы на Web-странице, показывающие текущее время с точностью до секунды, скрывать или отображать элементы Web-страницы и выполнять многие другие действия. Как все это сделать, рассказано в главе 3.

В главе 3 также описывается технология AJAX, позволяющая программно подгружать с сервера произвольные данные без перезагрузки самой страницы. Это могут быть как фрагменты HTML-кода, выводимые на страницу непосредственно, так и данные, закодированные в формате JSON и предназначенные для использования в JavaScript-программах. Применение технологии AJAX позволит значительно расширить функциональность создаваемых сайтов.

Глава 4 повествует, как установить и настроить специальное программное обеспечение для тестирования сайтов: Web-сервер Apache, среду для выполнения серверных скриптов, написанных на языке PHP, и сервер баз данных MySQL. Таким образом, можно проверить работоспособность создаваемого сайта непосредственно на своем компьютере, еще до его публикации в Интернете.

Огромные возможности открывают серверные технологии, среди которых для целей данной книги выбран язык программирования PHP. Это наиболее распространенный в настоящее время язык для написания серверных скриптов. Используя его (или другие программные платформы, применяемые для создания динамических Web-страниц), можно изменять HTML-код, получаемый Web-браузером, в зависимости от вводимых пользователем данных, типа и версии установленного Web-браузера и других факторов. Большое количество расширений и готовых программных продуктов, а также легкость освоения сделали PHP очень популярным языком программирования для Интернета. С помощью PHP можно работать с файлами и каталогами, обрабатывать данные формы на сервере, рассылать письма, загружать файлы на сервер, создавать для каждого пользователя Личный кабинет, программировать гостевые книги, форумы, блоги, интернет-магазины и многое другое. Писать программы на PHP мы научимся в главе 5.

На сегодняшний день ни один крупный портал не обходится без использования баз данных. В Web-разработках чаще всего применяется быстрая, бесплатная и обладающая большими возможностями система управления базами данных (СУБД) MySQL. С помощью MySQL можно эффективно добавлять, изменять и удалять данные, получать нужную информацию по запросу. Работа с MySQL, в том числе с базами данных этого формата из программ, написанных на PHP, обсуждается в главе 6.

В электронном приложении, доступном на сайте издательства БХВ-Петербург , собраны следующие материалы:

описание процесса установки и настройки специализированных редакторов, которые позволят значительно упростить создание сайта и сделают процесс изучения материала книги более эффективным;

описание процесса публикации сайта в Интернете (подбор подходящей площадки, работа с FTP-клиентом, настройка Web-сервера Apache, выполнение автоматического запуска программ в определенное время, подготовка сайта к индексации и т. д.);

дополнительные руководства (описание фильтров и преобразований, которые доступны в Web-браузере Internet Explorer, и электронный самоучитель языка Perl);

описание процесса разработки полнофункционального Web-сайта с использованием всех изученных технологий. Это каталог сайтов, включающий личный кабинет для пользователей с защитой средствами PHP, а также личный кабинет для администратора, защищенный средствами сервера Apache;

все листинги, встречающиеся в тексте книги.

Авторы желают приятного прочтения и надеются, что эта книга станет верным спутником в вашей программистской практике.

Глава 1. Основы HTML. Создаем дизайн сайта

1.1. Основные понятия

HTML (HyperText Markup Language) — это язык разметки документа, описывающий форму отображения информации на экране компьютера.

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

Символ указывает, что текст надо выделить, начиная с этого места, а отмечает конец выделенного фрагмента.

Символы и принято называть тегами. С помощью тегов описывается вся структура документа. Теги выделяются угловыми скобками и > , между которыми указывается имя тега. Большинство тегов являются парными, т. к. есть открывающий тег () и соответствующий ему закрывающий (). Закрывающий тег отличается наличием косой черты ( / ) перед его именем. Есть также теги, вообще не имеющие закрывающего тега, например тег переноса строки
.

Некоторые теги могут иметь параметры (иногда их называют атрибутами). Параметры указываются после имени тега через пробел в формате параметр= значение . Если параметров несколько, то они перечисляются через пробел. Например:

Content-Type content= text/html; charset=windows-1251 >

В этом примере параметру http-equiv тега присвоено значение Content-Type, а параметру content — значение text/html; charset=windows-1251.

Теги могут вкладываться друг в друга. Например:

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

Примечание

В HTML названия тегов и параметров можно записывать в любом регистре, а в языке XHTML только в нижнем регистре.

Просматривать HTML-документы можно с помощью специальных программ, которые называют Web-браузерами. Web-браузеры отображают документы с форматированием, выполненным на основе исходного кода, описывающего структуру документа.

Илон Маск рекомендует:  Тег mark

Результат интерпретацииHTML-документа, отображаемый в окне Web-браузера, называется Web-страницей. В отличие от HTML-документа Web-страница может содержать не только текст, но и графику, видео, звуковое сопровождение, может реагировать на действия пользователя и т. д. Кроме того, Web-страница может быть результатом интерпретации сразу нескольких HTML-документов.

Документы в формате HTML имеют расширение html или htm.

Прежде чем изучать язык HTML, советуем установить на компьютер один из редакторов — FCKeditor или tinyMCE. Эти редакторы написаны на языке программирования JavaScript и работают в Web-браузере.

Скачать FCKeditor можно со страницы http://ckeditor.com/download. После распаковки архива запустите файл sample07.html (расположен в папке fckeditor\_samples\html\). Если вы используете Web-браузер Firefox, то для работы редактора необходимо выполнить следующие действия:

1. В адресной строке вводим about:config и нажимаем клавишу .

2. Находим директиву security.fileuri.strict_origin_policy и двойным щелчком на строке устанавливаем значение false .

На рис. 1.1 можно увидеть, как выглядит редактор FCKeditor, запущенный в Web-браузере Firefox. Если вы раньше работали с текстовым редактором Microsoft Word, то большинство кнопок на панели инструментов будет вам знакомо. Принцип работы в FCKeditor точно такой же, как и в Word. После ввода текста и его форматирования редактор автоматически генерирует HTML-код. Посмотреть исходный HTML-код можно нажав кнопку Источник на панели инструментов (рис. 1.2). Следует заметить, что при изменении исходного HTML-кода автоматически изменяется и внешний вид документа.

Скачать tinyMCE можно со страницы http://tinymce.moxiecode.com/download.php. После загрузки распаковываем архив в текущую папку. Для русификации редактора со страницы http://tinymce.moxiecode.com/download_i18n.php необходимо скачать архив с файлами для русского языка. Архив следует разместить в папке tinymce\jscripts\tiny_mce\, а затем распаковать в текущую папку. Все файлы будут автоматически распределены по каталогам. Чтобы подключить поддержку русского языка, необходимо в файле full.html (расположен в папке tinymce\examples\) добавить строку

сразу после строки

Рис. 1.1. Редактор FCKeditor, запущенный в Web-браузере Firefox

Рис. 1.2. Результат нажатия кнопки Источник в редакторе FCKeditor

Рис. 1.3. Редактор tinyMCE, запущенный в Web-браузере Firefox

Теперь файл full.html открываем с помощью Web-браузера. На рис. 1.3 можно увидеть, как выглядит редактор tinyMCE, запущенный в Web-браузере Firefox.

1.2. Первый HTML-документ

Попробуем создать наш первый HTML-документ. Для его создания можно воспользоваться любым текстовым редактором. Самым распространенным редактором является обычный Блокнот. Открываем Блокнот и набираем содержимое листинга 1.1.

Листинг 1.1. Первый HTML-документ

-//W3C//DTD HTML 4.01//EN

Content-Type content= text/html; charset=windows-1251 >

Этот текст выделен полужирным шрифтом

Сохраняем введенный текст в формате HTML, например, под именем test.html. Для этого в меню Файл выбираем пункт Сохранить как. В открывшемся окне в строке Имя файла вводим test.html , а в списке Тип файла указываем Все файлы. Выбираем папку, например, Рабочий стол, и нажимаем Сохранить. Закрываем Блокнот.

Примечание

Если в списке Тип файла оставить Текстовые документы (*.txt), то в строке Имя файла название файла необходимо заключить в кавычки, иначе к имени файла будет добавлено расширение txt.

Запускаем Web-браузер, например, Internet Explorer. С помощью пункта Открыть меню Файл открываем сохраненный файл test.html. Если все сделано правильно, то в окне Web-браузера будет показана выделенная надпись Этот текст выделен полужирным шрифтом , а в строке заголовка будет надпись Заголовок страницы — Microsoft Internet Explorer . Теги в окне Web-браузера не отображаются!

Теперь попробуем изменить заголовок в окне Web-браузера. Для этого необходимо открыть исходный текст в формате HTML. Это можно сделать тремя способами:


в меню Вид выбрать пункт Просмотр HTML-кода;

правой кнопкой мыши щелкнуть в любом месте окна Web-браузера. В появившемся контекстном меню выбрать пункт Просмотр HTML-кода;

Примечание

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

открыть файл, содержащий исходный код, с помощью Блокнота или другого текстового редактора. Этот способ является самым универсальным. Настоятельно рекомендую использовать именно его.

В итоге исходный текст будет доступен для редактирования. Изменим строчку

Моя первая Web-страница

и сохраним файл (меню Файл, пункт Сохранить). Теперь вернемся в Web-браузер и обновим Web-страницу. Обновить можно следующими способами:

в меню Вид выбрать пункт Обновить;

выбрать этот же пункт в контекстном меню;

нажать кнопку Обновить на Панели инструментов;

на клавиатуре нажать клавишу .

В результате строка заголовка изменится на Моя первая Web-страница — Microsoft Internet Explorer .

Таким образом, изменяя что-либо в исходном коде, можно визуально оценивать результаты произведенных действий. Алгоритм такой: открываем исходный код, вносим корректировку, сохраняем, а затем обновляем Web-страницу.

Примечание

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

Очень хорошей альтернативой Блокноту является программа Notepad++. Она позволяет корректно работать как с кодировкой windows-1251, так и с кодировкой UTF-8, а также имеет подсветку синтаксиса HTML, JavaScript, PHP и др. Именно этой программой мы будем пользоваться на протяжении всей книги.

Скачать программу Notepad++ можно абсолютно бесплатно со страницы http://notepad-plus.sourceforge.net/ru/site.htm. Из двух вариантов (ZIP-архив и инсталлятор) советую выбрать именно инсталлятор, т. к. при установке можно будет указать язык интерфейса программы. Установка Notepad++ предельно проста и в комментариях не нуждается.

Запускаем программу Notepad++. В меню Кодировки устанавливаем флажок Кодировать в ANSI. Набираем код, представленный в листинге 1.1, а затем в меню Файл выбираем пункт Сохранить как. В открывшемся окне в строке Имя файла вводим test.html . Выбираем папку, например Рабочий стол, и нажимаем Сохранить. Для просмотра открываем файл с помощью Web-браузера.

Чтобы открыть какой-либо файл на редактирование, в меню Файл выбираем пункт Открыть или щелкаем правой кнопкой мыши на ярлыке файла в Проводнике Windows и из контекстного меню выбираем пункт Edit with Notepad++.

Примечание

Вместо Notepad++ можно воспользоваться редакторами PHP Expert Editor, Aptana Studio или NetBeans. Эти редакторы помимо подсветки синтаксиса предоставляют множество дополнительных функций. Тем не менее для быстрого редактирования файла удобнее пользоваться Notepad++. Описание редакторов вы найдете в главе 4.

1.3. Структура документа

Итак, мы изучили технологию создания HTML-документов, научились сохранять, отображать и изменять исходный код. Пришла пора вернуться к языку HTML. В листинге 1.2 представлена структура, характерная для любого HTML-документа.

Листинг 1.2. Структура HTML-документа

Тег позволяет определить Web-браузеру формат файла и правильно отобразить все его инструкции. Допустимые форматы для HTML 4.01:

Strict — строгий формат. Не содержит тегов и параметров, помеченных как устаревшие или не одобряемые. Объявление формата:

-//W3C//DTD HTML 4.01//EN

Transitional — переходный формат. Содержит устаревшие теги в целях совместимости и упрощения перехода со старых версий HTML. Объявление формата:

-//W3C//DTD HTML 4.01 Transitional//EN

Frameset — аналогичен переходному формату, но содержит также теги для создания фреймов. Объявление формата:

-//W3C//DTD HTML 4.01 Frameset//EN

Если тег не указан, то Web-браузер Internet Explorer переходит в режим совместимости (Quirks Mode). В этом режиме отличается тип блочной модели. Поэтому при отсутствии тега разные Web-браузеры могут по-разному отображать Web-страницу.

Примечание

Более подробную информацию о типах блочной модели можно получить в Интернете на странице консорциума W3C http://www.w3.org/TR/CSS2/box.html и на странице http://www.quirksmode.org/css/quirksmode.html.

Весь текст HTML-документа расположен между тегами и . HTML-документ состоит из двух разделов — заголовка (между тегами и ) и содержательной части (между тегами и ).

1.3.1. Раздел HEAD. Техническая информация о документе

Раздел HEAD содержит техническую информацию о странице — заголовок, ее описание и ключевые слова для поисковых машин, данные об авторе и времени создания страницы, базовом адресе страницы, кодировке и т. д.

Единственным обязательным тегом в разделе HEAD является тег . Текст, расположенный между тегами и , отображается в строке заголовка Web-браузера. Длина заголовка должна быть не более 60 символов, иначе он полностью не поместится в заголовке Web-браузера:

Совет

Очень часто текст между тегами и используется в результатах, выдаваемых поисковым порталом, в качестве текста ссылки на эту страницу. По этой причине заголовок должен максимально полно описывать содержание страницы. Не следует писать что-то вроде Главная страница , Первая страница и т. п.

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

description content= Описание содержимого страницы >

keywords content= Ключевые слова через запятую >

Можно также указать несколько описаний на разных языках. Для этого в параметре lang следует указать используемый язык:

description lang= ru content= Описание содержимого страницы >

description lang= en content= Description >

keywords lang= ru content= Ключевые слова через запятую >

keywords lang= en content= Keywords >

Кроме того, тег позволяет запретить или разрешить индексацию Web-страницы поисковыми машинами:

В параметре content указывается комбинация следующих значений:

index — индексация разрешена;

noindex — индексация запрещена;

follow — разрешено переходить по ссылкам, которые находятся на этой Web-странице;

nofollow — запрещено переходить по ссылкам;

all — комбинация index плюс follow;

none — комбинация noindex плюс nofollow.

Приведем ряд примеров. Индексация и переход по ссылкам разрешены:

robots content= index, follow >

Индексация разрешена, а переход по ссылкам запрещен:

robots content= index, nofollow >

Индексация и переход по ссылкам запрещены:

robots content= noindex, nofollow >

Также с помощью тега можно указать кодировку текста:

Content-Type content= text/html; charset=windows-1251 >

Для автоматической перезагрузки страницы через заданный промежуток времени следует воспользоваться свойством refresh тега :

refresh content= 30 >

В этом примере страница будет перезагружена через 30 секунд. Если необходимо сразу перебросить посетителя на другую страницу, то можно указать URL-адрес в параметре url:

refresh content= 0; url=http://mail.ru/ >

Примечание

В разделе HEAD могут быть расположены также теги ,
,

1.3.2. Раздел BODY. Основная часть документа

В этом разделе располагается все содержимое документа. Большинство тегов, рассмотренных в этой главе книги, должны находиться именно между тегами и .

Следует отметить, что в формате Strict содержимое тега должно быть расположено внутри блочных элементов, например,

Тег имеет следующие параметры:

bgcolor задает цвет фона Web-страницы. Даже если цветом фона является белый, все равно следует указать цвет.

Цвет определяется цифрами в шестнадцатеричном коде. Для каждой составляющей цвета (красного, зеленого и синего) задается значение в пределах от 00 до FF. Эти значения объединяются в одно число, перед которым добавляется символ # , например, значение #FF0000 соответствует красному цвету, #00FF00 — ярко-зеленому, а #FF00FF — фиолетовому (смеси красного и синего);

background позволяет задать фоновый рисунок для документа путем указания URL-адреса изображения;

alink определяет цвет активной ссылки;

link устанавливает цвет еще не просмотренных ссылок;

vlink определяет цвет уже просмотренных ссылок;

text устанавливает цвет текста.

Например, тег может выглядеть так:

-//W3C//DTD HTML 4.01 Transitional//EN

Content-Type content= text/html; charset=windows-1251 >

#FF0000 link= #000000 vlink= #000080 text= #000000 >

Обратите внимание

Все рассмотренные в этом разделе параметры являются устаревшими и поддерживаются только в формате Transitional. Использование их в формате Strict недопустимо.

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

1.4. Форматирование отдельных символов

Как уже говорилось, HTML — это язык разметки. Следовательно, важно уметь форматировать отдельные символы, а также целые фрагменты текста. Но прежде чем изучать теги, рассмотрим возможность отображения специальных символов. Такими символами, например, являются знаки меньше ( ), т. к. с помощью этих символов описываются HTML-теги. Для отображения специальных символов используются так называемые HTML-эквиваленты. Например, для вывода такого текста

Текст между тегами и используется в результатах,

выдаваемых поисковым порталом.

необходимо написать так

Текст между тегами и используется

в результатах, выдаваемых поисковым порталом.

В этом примере мы заменили знак меньше ( ) — на >. Перечислим наиболее часто используемые HTML-эквиваленты:

© — знак авторских прав (Ó);

® — знак зарегистрированной торговой марки (Ò);

™ — торговая марка (Ô).

1.4.1. Выделение фрагментов текста

Тег отображает текст полужирным шрифтом:

Вместо тега лучше использовать тег логического форматирования :

Полужирный шрифт

Тег отображает текст курсивом:

Текст, выделенный курсивом

Вместо тега лучше использовать тег логического форматирования :

Текст, выделенный курсивом

Тег отображает текст подчеркнутым:

Теги и отображают текст перечеркнутым:

Обратите внимание

Теги , и являются устаревшими и поддерживаются только в формате Transitional. Использование их в формате Strict недопустимо.

1.4.2. Создание нижних и верхних индексов

Тег сдвигает текст ниже уровня строки и уменьшает размер шрифта. Он используется для создания нижних индексов, например, Н2О:

Формула воды H2O

Тег сдвигает текст выше уровня строки и уменьшает размер шрифта. Этот тег используется чаще всего для создания степеней, например, м²:

Единица измерения площади — м 2

1.4.3. Вывод текста заданным шрифтом

Тег определяет размер, тип и цвет шрифта. Он имеет следующие параметры:

face служит для указания типа шрифта:

Можно указать как один, так и несколько типов, разделяя их запятыми. При этом список шрифтов просматривается слева направо. Указанное название должно точно соответствовать названию типа шрифта. Если шрифт не найден на компьютере пользователя, то используется шрифт по умолчанию;

size задает размер шрифта в условных единицах от 1 до 7. Размер, используемый Web-браузером по умолчанию, принято приравнивать к 3. Размер шрифта можно указывать как цифрой от 1 до 7, так и в относительных единицах, указывая, на сколько единиц нужно увеличить (знак + ) или уменьшить (знак – ) размер шрифта относительно базового:

color позволяет указывать цвет шрифта. Цвета задаются так же, как для параметра bgcolor(см.разд. 1.3.2):

Вместо цифр можно использовать названия цветов:

Перечислим названия наиболее часто используемых цветов:

black — #000000 — черный;

white — #FFFFFF — белый;

yellow — #FFFF00 — желтый;

silver — #C0C0C0 — серый;

red — #FF0000 — красный;

green — #008000 — зеленый;

gray — #808080 — темно-серый

blue — #0000FF — синий;

navy — #000080 — темно-синий;

purple — #800080 — фиолетовый.

Обратите внимание

Тег является устаревшим и поддерживается только в формате Transitional. Использование его в формате Strict недопустимо.

Также для форматирования текста применяются и другие теги. Для вывода текста шрифтом большего размера используется парный тег :

Текст большего размера

А для вывода текста шрифтом меньшего размера применяется парный тег :

Текст меньшего размера

Для вывода текста моноширинным шрифтом используется тег :

1.5. Форматирование документа

Практически все теги, рассмотренные в предыдущем разделе, являются тегами физического форматирования. Исключение составляют теги и . Эти теги являются тегами логического форматирования текста и используются для выделения очень важных и просто важных фрагментов соответственно. Теги логического форматирования используются для структурной разметки документа и могут отображаться разными Web-браузерами по-разному. Перечислим основные теги логического форматирования:

. — применяется для отметки цитат, а также названий произведений;

. — служит для отметки фрагментов программного кода;

. — отмечает фрагмент как вводимый пользователем с клавиатуры;

. — используется для отметки коротких цитат;

. — применяется для отметки результата, выдаваемого программой;

. — отмечает имена переменных.

1.5.1. Тег комментария

Текст, заключенный между тегами , не отображается Web-браузером. Заметим, что это нестандартная пара тегов, т. к. открывающий тег не имеет закрывающей угловой скобки, а в закрывающем теге отсутствует открывающая угловая скобка:

Совет

Использование комментариев в исходном коде позволит быстро найти нужный фрагмент. Это особенно важно для начинающих Web-дизайнеров.

1.5.2. Перевод строки

Для разделения строк используется одинарный тег
.

Если в HTML-документе набрать текст

то Web-браузер отобразит его в одну строку: Строка1 Строка2 Строка3 . Для того чтобы строки располагались друг под другом, необходимо добавить тег
в конец каждой строки:

Для вывода текста в том же виде, что и в исходном коде, можно воспользоваться парным тегом

В этом примере строки также будут располагаться друг под другом.

1.5.3. Горизонтальная линия

Одинарный тег позволяет провести горизонтальную линию.

Тег имеет следующие параметры:

size — толщина линии:

width — длина линии. Можно указывать значение как в пикселах, так и в процентах относительно ширины окна Web-браузера:

align — выравнивание линии. Параметр может принимать следующие значения:

center — выравнивание по центру (значение по умолчанию):

2 w >200 color= red align= center >

left — выравнивание по левому краю:

2 w >200 color= red align= left >

right — выравнивание по правому краю:

2 w >200 color= red align= right >

noshade — присутствие этого параметра отменяет рельефность линии:

2 w >200 align= center noshade>

Обратите внимание

Все рассмотренные параметры тега являются устаревшими и поддерживаются только в формате Transitional. Использование их в формате Strict недопустимо.

1.5.4. Заголовки

Заголовки могут иметь шесть различных размеров:

где x — число от 1 до 6.

Заголовок с номером 1 является самым крупным:

Самый крупный заголовок

Заголовок с номером 6 является самым мелким:

Самый мелкий заголовок

Основным параметром является align, он задает выравнивание заголовка относительно окна Web-браузера. Он может принимать следующие значения:

center — выравнивание по центру:

center>Заголовок первого уровня с выравниванием по

left — выравнивание по левому краю (по умолчанию):

left>Заголовок второго уровня с выравниванием по

right — выравнивание по правому краю:

right>Самый мелкий заголовок с выравниванием по

Обратите внимание

Параметр align является устаревшим и поддерживается только в формате Transitional. Использование его в формате Strict недопустимо.

1.5.5. Разделение на абзацы

позволяет разбить текст на отдельные абзацы. Web-браузеры отделяют абзацы друг от друга пустой строкой. Закрывающий тег

Основным параметром является align, он задает горизонтальное выравнивание. Параметр может принимать следующие значения:

center — выравнивание по центру:

center>Абзац с выравниванием по центру

left — выравнивание по левому краю (по умолчанию):

left>Абзац с выравниванием по левому краю

right — выравнивание по правому краю:

right>Абзац с выравниванием по правому краю

justify — выравнивание по ширине (по двум сторонам):

justify>Абзац с выравниванием по ширине

Обратите внимание

Параметр align является устаревшим и поддерживается только в формате Transitional. Использование его в формате Strict недопустимо.

1.6. Списки

Список — это набор упорядоченных абзацев текста, помеченных специальными значками (маркированные списки) или цифрами (нумерованные списки). Рассмотрим каждый из вариантов в отдельности.

1.6.1. Маркированные списки

Маркированный список помещают внутри пары тегов

    и

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

Листинг 1.3. Маркированный список

Тег

    имеет параметр type, позволяющий задать значок, которым помечаются строки списка. Параметр может принимать следующие значения:

disc — значки в форме кружков с заливкой:

circle — значки в форме кружков без заливки:

square — значки в форме квадрата с заливкой:

Обратите внимание

Параметр type является устаревшим и поддерживается только в формате Transitional. Использование его в формате Strict недопустимо.

1.6.2. Нумерованные списки

Нумерованный список помещают внутри пары тегов

    и

. Перед каждым пунктом списка необходимо поместить тег


. Закрывающий тег не обязателен.

В листинге 1.4 показана структура нумерованного списка.

Листинг 1.4. Нумерованный список

Тег

    имеет два параметра. Первый из них — type — позволяет задать формат, которым нумеруются строки списка.

Параметр может принимать следующие значения:

A — пункты нумеруются прописными латинскими буквами:

a — пункты нумеруются строчными латинскими буквами:

I — пункты нумеруются прописными римскими цифрами:

i — пункты нумеруются строчными римскими цифрами:

1 — пункты нумеруются арабскими цифрами (по умолчанию):

Второй параметр тега

    — start — задает номер, с которого будет начинаться нумерация строк:

Тег
также имеет параметр value, который позволяет изменить номер данного элемента списка:

В этом примере Первый пункт будет иметь номер 1, Второй пункт — номер 5, а Третий пункт — номер 6.

Обратите внимание

Параметры type, start и value являются устаревшими и поддерживаются только в формате Transitional. Использование их в формате Strict недопустимо.

1.6.3. Списки определений

Списки определений состоят из пар термин/определение . Описываются с помощью тега . Для вставки термина применяется тег , а для вставки определения — тег . Закрывающие теги и не обязательны. Пример использования списков определений приведен в листинге 1.5.

Листинг 1.5. Списки определений

-//W3C//DTD HTML 4.01//EN

Content-Type content= text/html; charset=windows-1251 >

HTML (HyperText Markup Language)

Язык разметки документа, описывающий форму отображения

информации на экране компьютера

CSS (Cascading Style Sheets)

Каскадные таблицы стилей

1.7. Графика

Применение графики делает Web-страницу визуально привлекательнее. Изображения помогают лучше передать суть и содержание документа. В Интернете применяются графические форматы:

GIF — использует только 256 цветов и поддерживает прозрачность. Кроме того, GIF-файл может содержать анимацию;

JPEG — метод сжатия фотографий с потерей качества. Прозрачность и анимация не поддерживаются;

PNG — формат хранения графики, использующий сжатие без потерь. Поддерживает прозрачность. Разрабатывался в качестве замены формата GIF.

Примечание

Загромождение документа графикой приводит к увеличению времени загрузки Web-страницы. По этой причине применяйте графику только там, где это действительно оправданно.

1.7.1. Изображение на Web-странице

Изображения вставляются в Web-страницы с помощью одинарного тега . Сам тег должен быть расположен внутри блочного тега, например,

Тег имеет следующие параметры:

src — URL-адрес файла графического изображения:

foto.gif alt= Текст подсказки >

http://www.mysite.ru/foto.gif alt= Текст подсказки >

alt — строка текста, которая будет выводиться на месте появления изображения до его загрузки или при отключенной графике, а также если изображение загрузить не удалось. Кроме того, при наведении курсора мыши на изображение текст, указанный в параметре alt, можно увидеть в качестве текста всплывающей подсказки:

foto.gif alt= Текст подсказки >

width — ширина изображения в пикселах:

foto.gif w >480 alt= Текст подсказки >

height — высота изображения в пикселах:

foto.gif w >480 height= 60 alt= Подсказка >

Примечание

Значения параметров width и height могут не соответствовать реальным размерам изображения. В этом случае Web-браузер выполнит перемасштабирование. Если значение одного из параметров указать неправильно, то изображение будет искажено. Если указать только один параметр, то значение второго будет рассчитано пропорционально значению первого исходя из реальных размеров изображения.

Совет

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

Следующие параметры доступны только при использовании формата Transitional:

border — толщина границы изображения:

foto.gif border= 0 alt= Текст подсказки >

align — расположение изображения относительно текста или других элементов Web-страницы. Параметр может принимать следующие значения:

left — изображение выравнивается по левому краю, а текст обтекает его с правой стороны:

foto.gif align= left alt= Подсказка >Текст

right — изображение выравнивается по правому краю, а текст обтекает его с левой стороны:

HTML, JavaScript, PHP и MySQL. Джентльменский набор Web-мастера

Создание интерактивных сайтов с помощью HTML, JavaScript, PHP и MySQL. Таблицы стилей (CSS). Конструкции языка PHP. Написание сценариев, базы данных MySQL и их администрирование. Программная среда на компьютере разработчика, настройка Web-сервера Apache.

Рубрика Программирование, компьютеры и кибернетика
Вид учебное пособие
Язык русский
Дата добавления 18.11.2014
Размер файла 7,5 M

Отправить свою хорошую работу в базу знаний просто. Используйте форму, расположенную ниже

Студенты, аспиранты, молодые ученые, использующие базу знаний в своей учебе и работе, будут вам очень благодарны.

HTML-версии работы пока нет.
Cкачать архив работы можно перейдя по ссылке, которая находятся ниже.

Подобные документы

Установка и настройка локального web–сервера и его компонентов. Конфигурационные файлы сервера Apache и их натройка. Настройка PHP, MySQL и Sendmail. Проверка работоспособности виртуальных серверов. Создание виртуальных хостов. Тест Server Side Includes.

учебное пособие [6,2 M], добавлен 27.04.2009

Основные технологии веб-программирования. Методы отправки данных на сервер с помощью HTML-формы. PHP — Препроцессор Гипертекста. Сохранение данных в базе данных MySQL. Клиент-Сервер и технология CGI. Примеры использования PHP совместно с MySQL.

лекция [2,9 M], добавлен 27.04.2009

Характеристика и технические возможности СУБД MySQL. Трехуровневая структура MySQL. Требования к аппаратному обеспечению. Создание таблицы, триггеров, генераторов, хранимых процедур в MySQL. Разработка приложения для базы данных с помощью Borland Delphi.

курсовая работа [940,7 K], добавлен 20.12.2011

Создание HTML-форм. Ввод многострочного текста. Тег FORM — контейнер форм. Трансляция переменных окружения. Передача данных с помощью формы. Приложения, хранящие данные о регистрации пользователей в базе данных MySQL. Порядок трансляции переменных.

лекция [5,6 M], добавлен 27.04.2009

Нормализация предметной области «Сайт знакомств» и ее программная реализация с использованием СУБД MySQL, языка HTML, технологии PHP и ADO, скриптовых языков VBScript или JavaScript. Руководство программиста, тестирование, исходный текст приложения.

реферат [29,0 K], добавлен 09.09.2010

Анализ предметной области «Ремонт часов», с использованием СУБД MySQL, языка HTML, технологии PHP и ADO и выбора скриптовых языков VBScript или JavaScript. Нормализация базы данных. Пошаговое описание нормализации базы данных (методом ER-диаграмм).

курсовая работа [782,4 K], добавлен 18.06.2010

Язык маркировки гипертекстов HTML, основа создания web-страниц. История спецификаций, каскадные таблицы стилей CSS. Способы определения таблиц стилей (стилевого шаблона). Язык подготовки сценариев JavaScript, его использование. Программный код web сайта.

курсовая работа [26,9 K], добавлен 05.07.2009

Синтаксис, типы данных, используемые в базе данных MySQL. Создание и удаление базы данных, создание таблицы и удаление таблицы, изменение ее свойств. Переименование, вставка и удаление столбцов, изменение их свойств. Обновление и поиск записей в таблице.

лабораторная работа [641,7 K], добавлен 04.03.2010

Основные технологии разработки ресурсов Интернет. Процесс разработки веб-сайта. Понятие Web-сайта и классификация Web-сайтов. Основные этапы разработки Web-сайта. Использование HTML, CSS, JavaScript, FLASH, PHP и реляционной базы данных MySQL.

презентация [1,3 M], добавлен 28.11.2015

Базовый синтаксис языка сценариев JavaScript. Создание страниц, включающих в себя программы, которые взаимодействуют с пользователем, управляют браузером и динамически создают HTML-содержимое. Работа с объектами, которые инкапсулируют данные и поведение.

лабораторная работа [58,6 K], добавлен 25.05.2020

Работы в архивах красиво оформлены согласно требованиям ВУЗов и содержат рисунки, диаграммы, формулы и т.д.
PPT, PPTX и PDF-файлы представлены только в архивах.
Рекомендуем скачать работу.

HTML, JavaScript, PHP и MySQL: Джентльменский набор Web-мастера. 4-е изд.

Обзор

Рассмотрены вопросы создания интерактивных Web-сайтов с помощью HTML, JavaScript, PHP и MySQL, форматирования Web-страниц при помощи CSS. Даны основы PHP и примеры написания типичных сценариев. Описаны приемы работы и администрирования баз данных MySQL при помощи PHP и программы phpMyAdmin. Особое внимание уделено созданию программной среды на компьютере разработчика и настройке Web-сервера Apache. Приведено описание текстового редактора Notepad++, шаблонизатора Smarty и прочих программ (Aptana Studio, NetBeans и HeidiSQL), необходимых Web-разработчику.
В 4-м издании содержится описание возможностей, предлагаемых HTML5 (средства семантической разметки и размещения аудио и видео) и CSS 3 (градиенты, создание тени, анимация и преобразования), технологии AJAX, формата JSON, новых инструментов JavaScript (включая средства геолокации и локальное хранилище данных) и всех нововведений, появившихся в актуальных на данный момент версиях Apache, PHP и MySQL.
Электронный архив содержит листинги примеров, руководство по созданию динамического сайта, самоучитель языка Perl, руководство по публикации сайта, инструкции по установке дополнительных программ и видеоуроки.

Читайте в мобильном приложении Scribd

Похожие

Похоже на «Книги»

Отрывок книги

HTML, JavaScript, PHP и MySQL — Николай Прохоренок

Прохоренок, Н. А.

П84 HTML, JavaScript, PHP и MySQL. Джентльменский набор Web-мастера. — 4-е изд., перераб. и доп. / Н. А. Прохоренок, В. А. Дронов. — СПб.: БХВ-Петербург, 2015. — 768 с.: ил. — (Профессиональное программирование)

Рассмотрены вопросы создания интерактивных Web-сайтов с помощью HTML, JavaScript, PHP и MySQL, форматирования Web-страниц при помощи CSS. Даны основы PHP и примеры написания типичных сценариев. Описаны приемы работы и администрирования баз данных MySQL при помощи PHP и программы phpMyAdmin. Особое внимание уделено созданию программной среды на компьютере разработчика и настройке Web-сервера Apache. Приведено описание текстового редактора Notepad++, шаблонизатора Smarty и прочих программ (Aptana Studio, NetBeans и HeidiSQL), необходимых Web-разработчику.

В 4-м издании содержится описание возможностей, предлагаемых HTML5 (средства семантической разметки и размещения аудио и видео) и CSS 3 (градиенты, создание тени, анимация и преобразования), технологии AJAX, формата JSON, новых инструментов JavaScript (включая средства геолокации и локальное хранилище данных) и всех нововведений, появившихся в актуальных на данный момент версиях Apache, PHP и MySQL.

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

Группа подготовки издания:

Главный редактор Екатерина Кондукова

Зам. главного редактора Евгений Рыбаков

Зав. редакцией Екатерина Капалыгина

Редактор Леонид Кочин

Корректор Зинаида Дмитриева

Дизайн серии Инны Тачиной

Оформление обложки Марины Дамбиевой

© Прохоренок Н. А., Дронов В. А., 2015

© Оформление, издательство БХВ-Петербург , 2015

Оглавление

Введение

Глава 1. Основы HTML. Создаем дизайн сайта

1.1. Основные понятия

1.2. Первый HTML-документ

1.3. Структура документа

1.3.1. Раздел HEAD. Техническая информация о документе

1.3.2. Раздел BODY. Основная часть документа

1.4. Форматирование отдельных символов

1.4.1. Выделение фрагментов текста

1.4.2. Создание нижних и верхних индексов

1.4.3. Вывод текста заданным шрифтом

1.5. Форматирование документа

1.5.1. Тег комментария

1.5.2. Перевод строки

1.5.3. Горизонтальная линия

1.5.5. Разделение на абзацы

1.6.1. Маркированные списки

1.6.2. Нумерованные списки

1.6.3. Списки определений

1.7.1. Изображение на Web-странице

1.7.2. Изображение в качестве фона

1.8.1. Внешние гиперссылки

1.8.2. Внутренние гиперссылки

1.8.3. Гиперссылки на адрес электронной почты

1.9.1. Вставка таблицы в документ

1.9.2. Заголовок таблицы

1.9.3. Строки таблицы

1.9.4. Ячейки таблицы

1.10.1. Разделение окна Web-браузера на несколько областей

1.10.2. Структура HTML-документа, содержащего фреймы

1.10.3. Описание фреймовой структуры

1.10.4. Описание отдельных областей

1.10.6. Загрузка документа в определенный фрейм

1.11.1. Карта-изображение как панель навигации

1.11.2. Структура карт-изображений

1.11.4. Описание активной области на карте-изображении

1.12.1. Создание формы для регистрации сайта

1.12.2. Структура документа с формами

1.12.3. Добавление формы в документ

1.12.4. Описание элементов управления

1.12.6. Группировка элементов формы

1.14. Отличия XHTML 1.0 от HTML 4.01

1.15. Проверка HTML-документов на соответствие стандартам

1.16. Специальный тег в Web-браузере Internet Explorer

1.17.1. Требования к страницам, написанным на HTML5

1.17.2. Семантическая разметка

1.17.4. Новые возможности форм и элементов управления

1.17.5. Прочие нововведения

1.17.6. Теги и параметры, объявленные устаревшими

Глава 2. Основы CSS. Форматируем Web-страницу с помощью стилей

2.1. Основные понятия

2.2. Способы встраивания определения стиля

2.2.1. Встраивание определения стиля в тег

2.2.2. Встраивание определения стилей в заголовок HTML-документа

2.2.3. Вынесение таблицы стилей в отдельный файл

2.2.4. Приоритет применения стилей

2.3. Единицы измерения в CSS

2.4. Форматирование шрифта

2.4.2. Стиль шрифта

2.4.3. Размер шрифта

2.4.4. Цвет шрифта

2.4.5. Жирность шрифта

2.5. Форматирование текста

2.5.1. Расстояние между символами в словах

2.5.2. Расстояние между словами

2.5.3. Отступ первой строки

2.5.4. Вертикальное расстояние между строками

2.5.5. Горизонтальное выравнивание текста

2.5.6. Вертикальное выравнивание текста

2.5.7. Подчеркивание, надчеркивание и зачеркивание текста

2.5.8. Изменение регистра символов

2.5.9. Обработка пробелов между словами

2.6.1. Внешние отступы

2.6.2. Внутренние отступы

2.7.1. Стиль линии рамки

2.7.2. Толщина линии рамки

2.7.3. Цвет линии рамки

2.7.4. Одновременное задание атрибутов рамки

2.8. Фон элемента

2.8.2. Фоновый рисунок

2.8.3. Режим повтора фонового рисунка

2.8.4. Прокрутка фонового рисунка

2.8.5. Положение фонового рисунка

2.8.6. Одновременное задание атрибутов фона

2.9.1. Вид маркера списка

2.9.2. Изображение в качестве маркера списка

2.9.3. Компактное отображение списка

2.10. Вид курсора

2.11. Псевдостили гиперссылок. Отображение ссылок разными цветами

2.12. Форматирование блоков

2.12.1. Указание типа блока

2.12.2. Установка размеров

2.12.3. Атрибут overflow

2.12.4. Управление обтеканием

2.12.5. Позиционирование блока

2.12.6. Последовательность отображения слоев

2.13. Управление отображением элемента

2.14.1. Новые селекторы

2.14.2. Новые единицы измерения размеров и способы задания цвета

2.14.3. Параметры фона

2.14.4. Рамки со скругленными углами

2.14.5. Параметры таблиц

2.14.6. Параметры тени

2.14.7. Загружаемые шрифты

2.14.8. Режимы установки размеров

2.14.9. Градиентные фоны

2.14.10. Анимация с двумя состояниями

2.14.11. Анимация с несколькими состояниями

2.14.12. Двумерные преобразования

2.14.13. Трехмерные преобразования

2.15. Проверка CSS-кода на соответствие стандартам

Глава 3. Основы JavaScript. Создаем страницы, реагирующие на действия пользователей

3.1. Основные понятия


3.2. Первая программа на JavaScript

3.3. Комментарии в JavaScript

3.4. Вывод результатов работы программы и ввод данных

3.4.1. Окно с сообщением и кнопкой OK

3.4.2. Окно с сообщением и кнопками OK и Cancel

3.4.3. Окно с полем ввода и кнопками OK и Cancel

3.6. Типы данных и инициализация переменных. Определение типа данных переменной

3.7. Операторы JavaScript

3.7.1. Математические операторы

3.7.2. Операторы присваивания

3.7.3. Двоичные операторы

3.7.4. Оператор обработки строк

3.7.5. Приоритет выполнения операторов

3.8. Преобразование типов данных

3.9. Специальные символы. Разбиение сообщения в диалоговом окне на несколько строк

3.11. Функции. Разделение программы на фрагменты

3.11.1. Основные понятия

3.11.2. Расположение функций внутри HTML-документа

3.11.3. Рекурсия. Вычисление факториала

3.11.4. Глобальные и локальные переменные

3.12. Условные операторы. Выполнение блоков кода только при соответствии условию

3.12.1. Операторы сравнения

3.12.2. Оператор ветвления if. else. Проверка ввода пользователя

3.12.3. Оператор ? Проверка числа на четность

3.12.4. Оператор выбора switch

3.13. Операторы циклов. Многократное выполнение блока кода

3.13.2. Цикл while

3.13.3. Цикл do. while

3.13.4. Оператор continue. Переход на следующую итерацию цикла

3.13.5. Оператор break. Прерывание цикла

3.14. Ошибки в программе

3.14.1. Синтаксические ошибки

3.14.2. Логические ошибки

3.14.3. Ошибки времени выполнения

3.14.4. Обработка ошибок

3.14.5. Модуль Firebug для Web-браузера Firefox

3.15. Встроенные классы JavaScript

3.15.1. Основные понятия

3.15.2. Класс Global

3.15.3. Класс Number. Работа с числами

3.15.4. Класс String. Обработка строк

3.15.5. Класс Array. Работа с массивами и их сортировка

3.15.6. Класс Math. Использование математических функций

3.15.7. Класс Date. Получение текущей даты и времени. Вывод даты и времени в окне Web-браузера

3.15.8. Класс Function (функции)

3.15.9. Класс Arguments. Функции с произвольным количеством аргументов

3.15.10. Класс RegExp. Проверка значений с помощью регулярных выражений

3.16.1. Основные понятия

3.16.2. События мыши

3.16.3. События клавиатуры

3.16.4. События документа

3.16.5. События формы

3.16.6. Последовательность событий

3.16.7. Всплывание событий

3.16.8. Действия по умолчанию и их отмена

3.16.9. Написание обработчиков событий

3.16.10. Объект event. Вывод координат курсора и кода нажатой клавиши. Вывод сообщений при нажатии комбинации клавиш

3.17. Объектная модель Microsoft Internet Explorer

3.17.1. Структура объектной модели

3.17.2. Объект window. Вывод сообщения в строку состояния Web-браузера

3.17.3. Работа с окнами. Создание нового окна без строки меню, адресной строки и панели инструментов

3.17.4. Модальные диалоговые окна. Использование модальных окон вместо встроенных диалоговых окон

3.17.5. Таймеры. Создание часов на Web-странице

3.17.6. Объект navigator. Получение информации о Web-браузере пользователя. Перенаправление клиента на разные страницы в зависимости от Web-браузера

3.17.7. Объект screen. Получение информации о мониторе пользователя

3.17.8. Объект location. Разбор составляющих URL-адреса документа. Создание многостраничных HTML-документов

3.17.9. Объект history. Получение информации о просмотренных страницах. Реализация перехода на предыдущую просмотренную страницу

3.17.10. Объект document. Получение полной информации о HTML-документе

3.17.11. Обращение к элементам документа. Выравнивание заголовков по центру

3.17.12. Работа с элементами документа. Изменение URL-адреса и текста ссылки. Преобразование ссылки в обычный текст

3.17.13. Объект style. Работа с таблицами стилей при помощи JavaScript

3.17.14. Объект selection. Проверка наличия выделенного фрагмента

3.17.15. Объект TextRange. Поиск фрагмента в текстовом поле или документе. Расширение или сжатие выделенного фрагмента текста

3.17.16. Работа с буфером обмена. Выделение фрагмента от позиции щелчка до конца документа и копирование его в буфер обмена

3.17.17. Реализация ссылок Добавить сайт в Избранное и Сделать стартовой страницей

3.17.18. Сохранение данных на компьютере клиента. Определение возможности использования cookies. Сохранение русского текста в cookies

3.18. Работа с элементами формы

3.18.1. Элементы управления

3.18.2. Коллекция Forms. Доступ к элементу формы из скрипта

3.18.3. Свойства объекта формы

3.18.4. Методы объекта формы

3.18.5. События объекта формы

3.18.6. Текстовое поле и поле ввода пароля. Проверка правильности ввода E-mail и пароля. Получение данных из элемента формы

3.18.7. Поле для ввода многострочного текста. Добавление слов из текстового поля в поле

3.18.8. Список с возможными значениями. Возможность добавления нового пункта. Применение списков вместо гиперссылок

3.18.9. Флажок и переключатели. Получение значения выбранного переключателя при помощи цикла и проверка установки флажка

3.18.10. Кнопки. Обработка нажатия кнопки. Деактивация кнопки. Создание клавиши быстрого доступа и вывод текста на кнопке определенным цветом

3.18.11. Проверка корректности данных. Создание формы регистрации пользователя

3.19. Пользовательские объекты

3.19.1. Создание объектов

3.19.3. Пространства имен

3.20.1. Подготовка к загрузке данных

3.20.2. Отправка запроса

3.20.3. Получение данных

3.20.4. Формат JSON

3.21.1. Обращение к элементам страницы

3.21.2. Управление содержимым страницы

3.21.3. Обработка событий

3.21.4. Работа с формами и элементами управления

3.21.5. Работа с графическими изображениями

3.21.6. Работа с мультимедиа

3.21.7. Канва HTML5. Программируемая графика

3.21.9. Средства геолокации

Глава 4. Программное обеспечение Web-сервера. Устанавливаем и настраиваем программы под Windows

4.1. Необходимые программы

4.2. Установка, настройка и запуск сервера Apache

4.2.1. Настройка сервера Apache

4.2.2. Запуск и останов Apache

4.2.3. Установка Apache как службы Windows

4.3. Структура каталогов сервера Apache

4.4. Файл конфигурации httpd.conf

4.4.1. Основные понятия

4.4.2. Разделы файла конфигурации

4.4.3. Общие директивы. Создание домашнего каталога пользователя, доступного при запросе http://localhost/

4.4.4. Переменные сервера и их использование

4.4.5. Директивы управления производительностью

4.4.6. Директивы обеспечения постоянного соединения

4.4.7. Директивы работы с языками

4.4.8. Директивы перенаправления

4.4.9. Обработка ошибок

4.4.10. Настройки MIME-типов

4.4.11. Управление листингом каталога

4.4.12. Директивы протоколирования

4.4.13. Файл конфигурации .htaccess. Управляем сервером Apache из обычной папки

4.4.14. Защита содержимого папки паролем

4.4.15. Управление доступом

4.4.16. Регулярные выражения, используемые в директивах

4.4.17. Создание виртуальных серверов

4.5. Установка PHP

4.6. Установка MySQL

4.7. Установка phpMyAdmin

Глава 5. Основы PHP. Создаем динамические Web-страницы

5.1. Основные понятия

5.2. Первая программа на PHP

5.2.1. Особенности создания скриптов в кодовой таблице UTF-8

5.3. Методы встраивания PHP-кода

Илон Маск рекомендует:  Шаблон сайта фирмы компании HTML, CSS, JS, 5 страниц

5.4. Комментарии в PHP-сценариях

5.5. Вывод результатов работы скрипта

5.7. Типы данных и инициализация переменных

5.8. Проверка существования переменной

5.9. Удаление переменной

5.10. Константы. Создание и использование констант

5.11. Операторы PHP

5.11.1. Математические операторы

5.11.2. Операторы присваивания

5.11.3. Двоичные операторы

5.11.4. Оператор конкатенации строк. Подстановка значений переменных.Запуск внешних программ

5.11.5. Приоритет выполнения операторов

5.12. Преобразование типов данных

5.13. Специальные символы

5.14.1. Инициализация массива

5.14.2. Получение и изменение элемента массива. Определение числа элементов массива

5.14.3. Многомерные массивы

5.14.4. Ассоциативные массивы

5.14.5. Слияние массивов

5.14.6. Перебор элементов массива

5.14.7. Добавление и удаление элементов массива

5.14.8. Переворачивание и перемешивание массива

5.14.9. Сортировка массива. Создание пользовательской сортировки

5.14.10. Получение части массива

5.14.11. Преобразование переменных в массив

5.14.12. Преобразование массива в переменные

5.14.13. Заполнение массива числами

5.14.14. Преобразование массива в строку

5.14.15. Проверка наличия значения в массиве

5.15.1. Функции для работы со строками

5.15.2. Настройка локали

5.15.3. Функции для работы с символами

5.15.4. Поиск и замена в строке

5.15.5. Функции для сравнения строк

5.15.6. Кодирование строк

5.15.7. Преобразование кодировок

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

5.15.9. Perl-совместимые регулярные выражения

5.15.10. Функции для работы со строками в кодировке UTF-8

5.15.11. Перегрузка строковых функций

5.16. Функции для работы с числами

5.17. Функции для работы с датой и временем. Получение текущей даты, даты создания файла и проверка корректности введенной даты

5.18. Функции. Разделение программы на фрагменты

5.18.1. Основные понятия

5.18.2. Расположение описаний функций

5.18.3. Операторы require и include. Выносим функции в отдельный файл. Создаем шаблоны для множества страниц

5.18.4. Операторы require_once и include_once

5.18.5. Рекурсия. Вычисляем факториал

5.18.6. Глобальные и локальные переменные. Использование глобальных переменных внутри функций

5.18.7. Статические переменные

5.18.8. Переменное число параметров в функции. Сумма произвольного количества чисел

5.19. Условные операторы. Выполнение блоков кода только при соответствии условию

5.19.1. Операторы сравнения

5.19.2. Оператор ветвления if. else. Проверка выбранного элемента из списка

5.19.3. Оператор ? Проверка числа на четность

5.19.4. Оператор выбора switch. Использование оператора switch вместо if. else

5.20. Операторы циклов. Многократное выполнение блока кода

5.20.2. Цикл while

5.20.3. Цикл do. while

5.20.4. Цикл foreach

5.20.5. Оператор continue. Переход на следующую итерацию цикла

5.20.6. Оператор break. Прерывание цикла

5.21. Завершение выполнения сценария. Навигация при выборе значения из списка

5.22. Ошибки в программе

5.22.1. Синтаксические ошибки

5.22.2. Логические ошибки

5.22.3. Ошибки времени выполнения

5.22.4. Обработка ошибок

5.22.5. Инструкция or die()

5.23. Переменные окружения

5.23.1. Суперглобальные массивы

5.23.2. Часто используемые переменные окружения

5.24. Заголовки HTTP

5.24.1. Основные заголовки

5.24.2. Функции для работы с заголовками. Перенаправление клиента на другой URL-адрес. Запрет кэширования страниц. Реализация ссылки Скачать. Просмотр заголовков, отправляемых сервером

5.24.3. Работа с cookies. Создаем индивидуальный счетчик посещений

5.25. Работа с файлами и каталогами

5.25.1. Основные понятия

5.25.2. Функции для работы с файлами. Создание файла, запись в файл, вывод содержимого файла в список

5.25.3. Перемещение внутри файла

5.25.4. Создание списка рассылки с возможностью добавления, изменения и удаления E-mail-адресов

5.25.5. Чтение CSV-файлов. Преобразование CSV-файла в HTML-таблицу

5.25.6. Права доступа в операционной системе UNIX

5.25.7. Функции для манипулирования файлами

5.25.8. Загрузка файлов на сервер

5.25.9. Функции для работы с каталогами. Создаем программу для просмотра всех доступных каталогов и файлов на диске

5.25.10. Получение информации из сети Интернет


5.26. Отправка писем с сайта. Рассылка писем по E-mail-адресам из файла

5.27. Аутентификация с помощью PHP. Создание Личного кабинета

5.28. Работа с графикой

5.28.1. Информация об установленной библиотеке GD

5.28.2. Получение информации об изображении

5.28.3. Работа с готовыми изображениями

5.28.4. Создание нового изображения

5.28.5. Работа с цветом

5.28.6. Рисование линий и фигур

5.28.7. Вывод текста в изображение. Создаем счетчик посещений

5.28.8. Изменение размеров и копирование изображений

5.29. Обработка данных формы

5.29.1. Текстовое поле, поле ввода пароля и скрытое поле

5.29.2. Поле для ввода многострочного текста

5.29.3. Список с возможными значениями

5.29.6. Кнопка Submit

5.29.7. Проверка корректности данных. Создание формы регистрации пользователя

5.30. Другие полезные функции

5.30.1. Выделение фрагментов исходного кода

5.30.2. Получение информации об интерпретаторе

5.30.3. Вывод всех доступных сценарию функций

5.30.4. Засыпание сценария

5.30.5. Изменение значения директив во время выполнения сценария

5.30.6. Выполнение команд, содержащихся в строке

5.31. Объектно-ориентированное программирование

5.31.1. Создание класса

5.31.2. Конструктор и деструктор

5.31.4. Статические свойства и методы

5.31.5. Объявление констант внутри класса

5.31.6. Определение области видимости

5.31.7. Абстрактные классы и методы

5.31.9. Оператор проверки типа instanceof

5.31.10. Создание шаблона сайта при помощи класса

5.32. Поддержка AJAX со стороны сервера. Кодирование данных в формате JSON

5.33. Шаблонизатор Smarty

5.33.1. Установка и настройка

5.33.2. Управляющие конструкции

5.33.3. Модификаторы переменных

5.33.4. Кэширование страниц

Глава 6. Основы MySQL. Работаем с базами данных

6.1. Основные понятия

6.2. Нормализация базы данных

6.3. Типы данных полей

6.3.1. Числовые типы

6.3.2. Строковые типы

6.3.3. Дата и время

6.4. Основы языка SQL

6.4.1. Создание базы данных

6.4.2. Создание пользователя базы данных

6.4.3. Создание таблицы

6.4.4. Добавление данных в таблицу

6.4.5. Обновление записей

6.4.6. Удаление записей из таблицы

6.4.7. Изменение структуры таблицы

6.4.8. Выбор записей

6.4.9. Выбор записей из нескольких таблиц

6.4.10. Индексы. Ускорение выполнения запросов

6.4.11. Удаление таблицы и базы данных

6.5. Доступ к базе данных из PHP с помощью библиотеки php_mysql.dll

6.5.1. Установка соединения

6.5.2. Выбор базы данных

6.5.3. Выполнение запроса к базе данных

6.5.4. Обработка результата запроса

6.6. Доступ к базе данных из PHP с помощью библиотеки php_mysqli.dll

6.6.1. Установка соединения

6.6.2. Выбор базы данных

6.6.3. Выполнение запроса к базе данных

6.6.4. Обработка результата запроса

6.7. Операторы MySQL

6.7.1. Математические операторы

6.7.2. Двоичные операторы

6.7.3. Операторы сравнения

6.7.4. Приоритет выполнения операторов

6.7.5. Преобразование типов данных

6.8. Поиск по шаблону

6.9. Поиск с помощью регулярных выражений

6.9.1. Метасимволы, используемые в регулярных выражениях

6.10. Режим полнотекстового поиска

6.10.1. Создание индекса FULLTEXT

6.10.2. Реализация полнотекстового поиска

6.10.3. Режим логического поиска

6.10.4. Поиск с расширением запроса

6.11. Функции MySQL

6.11.1. Функции для работы с числами

6.11.2. Функции даты и времени

6.11.3. Функции для обработки строк

6.11.4. Функции для шифрования строк

6.11.5. Информационные функции

6.11.6. Прочие функции

6.12. Переменные SQL

6.13. Временные таблицы

6.14. Вложенные запросы

6.14.1. Заполнение таблицы с помощью вложенного запроса

6.14.2. Применение вложенных запросов в инструкции WHERE

6.14.3. Применение вложенных запросов в инструкции FROM

6.15. Внешние ключи

6.16.1. Запуск, подтверждение и отмена транзакций

6.16.2. Изоляция транзакций

6.16.3. Автозавершение транзакций и его отключение

6.16.4. Поддержка транзакций библиотекой php_mysqli.dll

Приложение. Описание электронного архива

Введение

Если вы хотите научиться своими руками создавать сайты, свободно владеть HTML, CSS, JavaScript, PHP и MySQL, то эта книга для вас. Большинство подобных книг предлагают изучение или только клиентских технологий (HTML, CSS, JavaScript), или только серверных (PHP, MySQL). Но разделять эти инструменты нельзя, т. к. они могут существовать только совместно, а значит, и изучать их нужно как единое целое.

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

Что же можно создать с использованием описываемых технологий? Давайте кратко рассмотрим возможности этих технологий, а также содержание глав книги.

Язык разметки HTML, рассматриваемый в главе 1, позволяет задать местоположение элементов Web-страницы в окне Web-браузера. С помощью HTML можно отформатировать отдельные символы или целые фрагменты текста, вставить изображение, таблицу или форму, создать панель навигации с помощью карт-изображений, разделить окно Web-браузера на несколько областей, вставить гиперссылку и многое другое. А новая версия языка HTML — HTML5 — даже позволяет поместить на страницу аудио- или видеоролик, который будет воспроизводиться самим Web-браузером, без необходимости устанавливать какие бы то ни было плагины.

При помощи каскадных таблиц стилей (CSS), о которых идет речь в главе 2, можно задавать точные характеристики практически всех элементов Web-страницы. Это позволяет контролировать внешний вид Web-страницы в окне Web-браузера и приближает возможности Web-дизайна к настольным издательским системам. Разработчик может указать параметры шрифта, цвет текста и фона, выравнивание, создать рамку и расположить элементы на странице произвольным образом. Новая версия CSS — CSS 3 — также предоставляет инструменты для задания градиентного фона, теней у текста и самого элемента страницы и даже для создания анимации.

У Web-страниц, созданных с использованием HTML и CSS, есть существенный недостаток — они являются статическими, т. е. не могут меняться, реагируя на действия пользователя. Внедрение программ, написанных на языке JavaScript, в HTML-код позволит оживить Web-страницу, сделать ее интерактивной или, другими словами, заставить взаимодействовать с пользователем. С помощью JavaScript можно обрабатывать данные формы до отправки на сервер, получать информацию о Web-браузере пользователя и его мониторе и соответствующим образом менять форматирование страницы, создавать новые окна, изменять любые элементы HTML-документа в ответ на какое-либо событие, создавать часы на Web-странице, показывающие текущее время с точностью до секунды, скрывать или отображать элементы Web-страницы и выполнять многие другие действия. Как все это сделать, рассказано в главе 3.

В главе 3 также описывается технология AJAX, позволяющая программно подгружать с сервера произвольные данные без перезагрузки самой страницы. Это могут быть как фрагменты HTML-кода, выводимые на страницу непосредственно, так и данные, закодированные в формате JSON и предназначенные для использования в JavaScript-программах. Применение технологии AJAX позволит значительно расширить функциональность создаваемых сайтов.

Глава 4 повествует, как установить и настроить специальное программное обеспечение для тестирования сайтов: Web-сервер Apache, среду для выполнения серверных скриптов, написанных на языке PHP, и сервер баз данных MySQL. Таким образом, можно проверить работоспособность создаваемого сайта непосредственно на своем компьютере, еще до его публикации в Интернете.

Огромные возможности открывают серверные технологии, среди которых для целей данной книги выбран язык программирования PHP. Это наиболее распространенный в настоящее время язык для написания серверных скриптов. Используя его (или другие программные платформы, применяемые для создания динамических Web-страниц), можно изменять HTML-код, получаемый Web-браузером, в зависимости от вводимых пользователем данных, типа и версии установленного Web-браузера и других факторов. Большое количество расширений и готовых программных продуктов, а также легкость освоения сделали PHP очень популярным языком программирования для Интернета. С помощью PHP можно работать с файлами и каталогами, обрабатывать данные формы на сервере, рассылать письма, загружать файлы на сервер, создавать для каждого пользователя Личный кабинет, программировать гостевые книги, форумы, блоги, интернет-магазины и многое другое. Писать программы на PHP мы научимся в главе 5.

На сегодняшний день ни один крупный портал не обходится без использования баз данных. В Web-разработках чаще всего применяется быстрая, бесплатная и обладающая большими возможностями система управления базами данных (СУБД) MySQL. С помощью MySQL можно эффективно добавлять, изменять и удалять данные, получать нужную информацию по запросу. Работа с MySQL, в том числе с базами данных этого формата из программ, написанных на PHP, обсуждается в главе 6.

В электронном приложении, доступном на сайте издательства БХВ-Петербург , собраны следующие материалы:

описание процесса установки и настройки специализированных редакторов, которые позволят значительно упростить создание сайта и сделают процесс изучения материала книги более эффективным;

описание процесса публикации сайта в Интернете (подбор подходящей площадки, работа с FTP-клиентом, настройка Web-сервера Apache, выполнение автоматического запуска программ в определенное время, подготовка сайта к индексации и т. д.);

дополнительные руководства (описание фильтров и преобразований, которые доступны в Web-браузере Internet Explorer, и электронный самоучитель языка Perl);

описание процесса разработки полнофункционального Web-сайта с использованием всех изученных технологий. Это каталог сайтов, включающий личный кабинет для пользователей с защитой средствами PHP, а также личный кабинет для администратора, защищенный средствами сервера Apache;

все листинги, встречающиеся в тексте книги.

Авторы желают приятного прочтения и надеются, что эта книга станет верным спутником в вашей программистской практике.

Глава 1. Основы HTML. Создаем дизайн сайта

1.1. Основные понятия

HTML (HyperText Markup Language) — это язык разметки документа, описывающий форму отображения информации на экране компьютера.

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

Символ указывает, что текст надо выделить, начиная с этого места, а отмечает конец выделенного фрагмента.

Символы и принято называть тегами. С помощью тегов описывается вся структура документа. Теги выделяются угловыми скобками и > , между которыми указывается имя тега. Большинство тегов являются парными, т. к. есть открывающий тег () и соответствующий ему закрывающий (). Закрывающий тег отличается наличием косой черты ( / ) перед его именем. Есть также теги, вообще не имеющие закрывающего тега, например тег переноса строки
.

Некоторые теги могут иметь параметры (иногда их называют атрибутами). Параметры указываются после имени тега через пробел в формате параметр= значение . Если параметров несколько, то они перечисляются через пробел. Например:

Content-Type content= text/html; charset=windows-1251 >

В этом примере параметру http-equiv тега присвоено значение Content-Type, а параметру content — значение text/html; charset=windows-1251.

Теги могут вкладываться друг в друга. Например:

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

Примечание

В HTML названия тегов и параметров можно записывать в любом регистре, а в языке XHTML только в нижнем регистре.

Просматривать HTML-документы можно с помощью специальных программ, которые называют Web-браузерами. Web-браузеры отображают документы с форматированием, выполненным на основе исходного кода, описывающего структуру документа.

Результат интерпретацииHTML-документа, отображаемый в окне Web-браузера, называется Web-страницей. В отличие от HTML-документа Web-страница может содержать не только текст, но и графику, видео, звуковое сопровождение, может реагировать на действия пользователя и т. д. Кроме того, Web-страница может быть результатом интерпретации сразу нескольких HTML-документов.

Документы в формате HTML имеют расширение html или htm.

Прежде чем изучать язык HTML, советуем установить на компьютер один из редакторов — FCKeditor или tinyMCE. Эти редакторы написаны на языке программирования JavaScript и работают в Web-браузере.

Скачать FCKeditor можно со страницы http://ckeditor.com/download. После распаковки архива запустите файл sample07.html (расположен в папке fckeditor\_samples\html\). Если вы используете Web-браузер Firefox, то для работы редактора необходимо выполнить следующие действия:

1. В адресной строке вводим about:config и нажимаем клавишу .

2. Находим директиву security.fileuri.strict_origin_policy и двойным щелчком на строке устанавливаем значение false .

На рис. 1.1 можно увидеть, как выглядит редактор FCKeditor, запущенный в Web-браузере Firefox. Если вы раньше работали с текстовым редактором Microsoft Word, то большинство кнопок на панели инструментов будет вам знакомо. Принцип работы в FCKeditor точно такой же, как и в Word. После ввода текста и его форматирования редактор автоматически генерирует HTML-код. Посмотреть исходный HTML-код можно нажав кнопку Источник на панели инструментов (рис. 1.2). Следует заметить, что при изменении исходного HTML-кода автоматически изменяется и внешний вид документа.

Скачать tinyMCE можно со страницы http://tinymce.moxiecode.com/download.php. После загрузки распаковываем архив в текущую папку. Для русификации редактора со страницы http://tinymce.moxiecode.com/download_i18n.php необходимо скачать архив с файлами для русского языка. Архив следует разместить в папке tinymce\jscripts\tiny_mce\, а затем распаковать в текущую папку. Все файлы будут автоматически распределены по каталогам. Чтобы подключить поддержку русского языка, необходимо в файле full.html (расположен в папке tinymce\examples\) добавить строку

сразу после строки

Рис. 1.1. Редактор FCKeditor, запущенный в Web-браузере Firefox

Рис. 1.2. Результат нажатия кнопки Источник в редакторе FCKeditor

Рис. 1.3. Редактор tinyMCE, запущенный в Web-браузере Firefox

Теперь файл full.html открываем с помощью Web-браузера. На рис. 1.3 можно увидеть, как выглядит редактор tinyMCE, запущенный в Web-браузере Firefox.

1.2. Первый HTML-документ

Попробуем создать наш первый HTML-документ. Для его создания можно воспользоваться любым текстовым редактором. Самым распространенным редактором является обычный Блокнот. Открываем Блокнот и набираем содержимое листинга 1.1.

Листинг 1.1. Первый HTML-документ

-//W3C//DTD HTML 4.01//EN

Content-Type content= text/html; charset=windows-1251 >

Этот текст выделен полужирным шрифтом

Сохраняем введенный текст в формате HTML, например, под именем test.html. Для этого в меню Файл выбираем пункт Сохранить как. В открывшемся окне в строке Имя файла вводим test.html , а в списке Тип файла указываем Все файлы. Выбираем папку, например, Рабочий стол, и нажимаем Сохранить. Закрываем Блокнот.

Примечание

Если в списке Тип файла оставить Текстовые документы (*.txt), то в строке Имя файла название файла необходимо заключить в кавычки, иначе к имени файла будет добавлено расширение txt.

Запускаем Web-браузер, например, Internet Explorer. С помощью пункта Открыть меню Файл открываем сохраненный файл test.html. Если все сделано правильно, то в окне Web-браузера будет показана выделенная надпись Этот текст выделен полужирным шрифтом , а в строке заголовка будет надпись Заголовок страницы — Microsoft Internet Explorer . Теги в окне Web-браузера не отображаются!

Теперь попробуем изменить заголовок в окне Web-браузера. Для этого необходимо открыть исходный текст в формате HTML. Это можно сделать тремя способами:

в меню Вид выбрать пункт Просмотр HTML-кода;

правой кнопкой мыши щелкнуть в любом месте окна Web-браузера. В появившемся контекстном меню выбрать пункт Просмотр HTML-кода;

Примечание

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

открыть файл, содержащий исходный код, с помощью Блокнота или другого текстового редактора. Этот способ является самым универсальным. Настоятельно рекомендую использовать именно его.

В итоге исходный текст будет доступен для редактирования. Изменим строчку

Моя первая Web-страница

и сохраним файл (меню Файл, пункт Сохранить). Теперь вернемся в Web-браузер и обновим Web-страницу. Обновить можно следующими способами:

в меню Вид выбрать пункт Обновить;

выбрать этот же пункт в контекстном меню;

нажать кнопку Обновить на Панели инструментов;

на клавиатуре нажать клавишу .

В результате строка заголовка изменится на Моя первая Web-страница — Microsoft Internet Explorer .

Таким образом, изменяя что-либо в исходном коде, можно визуально оценивать результаты произведенных действий. Алгоритм такой: открываем исходный код, вносим корректировку, сохраняем, а затем обновляем Web-страницу.

Примечание

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

Очень хорошей альтернативой Блокноту является программа Notepad++. Она позволяет корректно работать как с кодировкой windows-1251, так и с кодировкой UTF-8, а также имеет подсветку синтаксиса HTML, JavaScript, PHP и др. Именно этой программой мы будем пользоваться на протяжении всей книги.

Скачать программу Notepad++ можно абсолютно бесплатно со страницы http://notepad-plus.sourceforge.net/ru/site.htm. Из двух вариантов (ZIP-архив и инсталлятор) советую выбрать именно инсталлятор, т. к. при установке можно будет указать язык интерфейса программы. Установка Notepad++ предельно проста и в комментариях не нуждается.

Запускаем программу Notepad++. В меню Кодировки устанавливаем флажок Кодировать в ANSI. Набираем код, представленный в листинге 1.1, а затем в меню Файл выбираем пункт Сохранить как. В открывшемся окне в строке Имя файла вводим test.html . Выбираем папку, например Рабочий стол, и нажимаем Сохранить. Для просмотра открываем файл с помощью Web-браузера.

Чтобы открыть какой-либо файл на редактирование, в меню Файл выбираем пункт Открыть или щелкаем правой кнопкой мыши на ярлыке файла в Проводнике Windows и из контекстного меню выбираем пункт Edit with Notepad++.

Примечание

Вместо Notepad++ можно воспользоваться редакторами PHP Expert Editor, Aptana Studio или NetBeans. Эти редакторы помимо подсветки синтаксиса предоставляют множество дополнительных функций. Тем не менее для быстрого редактирования файла удобнее пользоваться Notepad++. Описание редакторов вы найдете в главе 4.

1.3. Структура документа

Итак, мы изучили технологию создания HTML-документов, научились сохранять, отображать и изменять исходный код. Пришла пора вернуться к языку HTML. В листинге 1.2 представлена структура, характерная для любого HTML-документа.

Листинг 1.2. Структура HTML-документа

Тег позволяет определить Web-браузеру формат файла и правильно отобразить все его инструкции. Допустимые форматы для HTML 4.01:

Strict — строгий формат. Не содержит тегов и параметров, помеченных как устаревшие или не одобряемые. Объявление формата:

-//W3C//DTD HTML 4.01//EN

Transitional — переходный формат. Содержит устаревшие теги в целях совместимости и упрощения перехода со старых версий HTML. Объявление формата:

-//W3C//DTD HTML 4.01 Transitional//EN

Frameset — аналогичен переходному формату, но содержит также теги для создания фреймов. Объявление формата:

-//W3C//DTD HTML 4.01 Frameset//EN

Если тег не указан, то Web-браузер Internet Explorer переходит в режим совместимости (Quirks Mode). В этом режиме отличается тип блочной модели. Поэтому при отсутствии тега разные Web-браузеры могут по-разному отображать Web-страницу.

Примечание

Более подробную информацию о типах блочной модели можно получить в Интернете на странице консорциума W3C http://www.w3.org/TR/CSS2/box.html и на странице http://www.quirksmode.org/css/quirksmode.html.

Весь текст HTML-документа расположен между тегами и . HTML-документ состоит из двух разделов — заголовка (между тегами и ) и содержательной части (между тегами и ).

1.3.1. Раздел HEAD. Техническая информация о документе

Раздел HEAD содержит техническую информацию о странице — заголовок, ее описание и ключевые слова для поисковых машин, данные об авторе и времени создания страницы, базовом адресе страницы, кодировке и т. д.

Единственным обязательным тегом в разделе HEAD является тег . Текст, расположенный между тегами и , отображается в строке заголовка Web-браузера. Длина заголовка должна быть не более 60 символов, иначе он полностью не поместится в заголовке Web-браузера:

Совет

Очень часто текст между тегами и используется в результатах, выдаваемых поисковым порталом, в качестве текста ссылки на эту страницу. По этой причине заголовок должен максимально полно описывать содержание страницы. Не следует писать что-то вроде Главная страница , Первая страница и т. п.

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

description content= Описание содержимого страницы >

keywords content= Ключевые слова через запятую >

Можно также указать несколько описаний на разных языках. Для этого в параметре lang следует указать используемый язык:

description lang= ru content= Описание содержимого страницы >

description lang= en content= Description >

keywords lang= ru content= Ключевые слова через запятую >

keywords lang= en content= Keywords >

Кроме того, тег позволяет запретить или разрешить индексацию Web-страницы поисковыми машинами:

В параметре content указывается комбинация следующих значений:

index — индексация разрешена;

noindex — индексация запрещена;

follow — разрешено переходить по ссылкам, которые находятся на этой Web-странице;

nofollow — запрещено переходить по ссылкам;

all — комбинация index плюс follow;

none — комбинация noindex плюс nofollow.

Приведем ряд примеров. Индексация и переход по ссылкам разрешены:

robots content= index, follow >

Индексация разрешена, а переход по ссылкам запрещен:

robots content= index, nofollow >

Индексация и переход по ссылкам запрещены:

robots content= noindex, nofollow >

Также с помощью тега можно указать кодировку текста:

Content-Type content= text/html; charset=windows-1251 >

Для автоматической перезагрузки страницы через заданный промежуток времени следует воспользоваться свойством refresh тега :


refresh content= 30 >

В этом примере страница будет перезагружена через 30 секунд. Если необходимо сразу перебросить посетителя на другую страницу, то можно указать URL-адрес в параметре url:

refresh content= 0; url=http://mail.ru/ >

Примечание

В разделе HEAD могут быть расположены также теги ,
,

1.3.2. Раздел BODY. Основная часть документа

В этом разделе располагается все содержимое документа. Большинство тегов, рассмотренных в этой главе книги, должны находиться именно между тегами и .

Следует отметить, что в формате Strict содержимое тега должно быть расположено внутри блочных элементов, например,

Тег имеет следующие параметры:

bgcolor задает цвет фона Web-страницы. Даже если цветом фона является белый, все равно следует указать цвет.

Цвет определяется цифрами в шестнадцатеричном коде. Для каждой составляющей цвета (красного, зеленого и синего) задается значение в пределах от 00 до FF. Эти значения объединяются в одно число, перед которым добавляется символ # , например, значение #FF0000 соответствует красному цвету, #00FF00 — ярко-зеленому, а #FF00FF — фиолетовому (смеси красного и синего);

background позволяет задать фоновый рисунок для документа путем указания URL-адреса изображения;

alink определяет цвет активной ссылки;

link устанавливает цвет еще не просмотренных ссылок;

vlink определяет цвет уже просмотренных ссылок;

text устанавливает цвет текста.

Например, тег может выглядеть так:

-//W3C//DTD HTML 4.01 Transitional//EN

Content-Type content= text/html; charset=windows-1251 >

#FF0000 link= #000000 vlink= #000080 text= #000000 >

Обратите внимание

Все рассмотренные в этом разделе параметры являются устаревшими и поддерживаются только в формате Transitional. Использование их в формате Strict недопустимо.

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

1.4. Форматирование отдельных символов

Как уже говорилось, HTML — это язык разметки. Следовательно, важно уметь форматировать отдельные символы, а также целые фрагменты текста. Но прежде чем изучать теги, рассмотрим возможность отображения специальных символов. Такими символами, например, являются знаки меньше ( ), т. к. с помощью этих символов описываются HTML-теги. Для отображения специальных символов используются так называемые HTML-эквиваленты. Например, для вывода такого текста

Текст между тегами и используется в результатах,

выдаваемых поисковым порталом.

необходимо написать так

Текст между тегами и используется

в результатах, выдаваемых поисковым порталом.

В этом примере мы заменили знак меньше ( ) — на >. Перечислим наиболее часто используемые HTML-эквиваленты:

© — знак авторских прав (Ó);

® — знак зарегистрированной торговой марки (Ò);

™ — торговая марка (Ô).

1.4.1. Выделение фрагментов текста

Тег отображает текст полужирным шрифтом:

Вместо тега лучше использовать тег логического форматирования :

Полужирный шрифт

Тег отображает текст курсивом:

Текст, выделенный курсивом

Вместо тега лучше использовать тег логического форматирования :

Текст, выделенный курсивом

Тег отображает текст подчеркнутым:

Теги и отображают текст перечеркнутым:

Обратите внимание

Теги , и являются устаревшими и поддерживаются только в формате Transitional. Использование их в формате Strict недопустимо.

1.4.2. Создание нижних и верхних индексов

Тег сдвигает текст ниже уровня строки и уменьшает размер шрифта. Он используется для создания нижних индексов, например, Н2О:

Формула воды H2O

Тег сдвигает текст выше уровня строки и уменьшает размер шрифта. Этот тег используется чаще всего для создания степеней, например, м²:

Единица измерения площади — м 2

1.4.3. Вывод текста заданным шрифтом

Тег определяет размер, тип и цвет шрифта. Он имеет следующие параметры:

face служит для указания типа шрифта:

Можно указать как один, так и несколько типов, разделяя их запятыми. При этом список шрифтов просматривается слева направо. Указанное название должно точно соответствовать названию типа шрифта. Если шрифт не найден на компьютере пользователя, то используется шрифт по умолчанию;

size задает размер шрифта в условных единицах от 1 до 7. Размер, используемый Web-браузером по умолчанию, принято приравнивать к 3. Размер шрифта можно указывать как цифрой от 1 до 7, так и в относительных единицах, указывая, на сколько единиц нужно увеличить (знак + ) или уменьшить (знак – ) размер шрифта относительно базового:

color позволяет указывать цвет шрифта. Цвета задаются так же, как для параметра bgcolor(см.разд. 1.3.2):

Вместо цифр можно использовать названия цветов:

Перечислим названия наиболее часто используемых цветов:

black — #000000 — черный;

white — #FFFFFF — белый;

yellow — #FFFF00 — желтый;

silver — #C0C0C0 — серый;

red — #FF0000 — красный;

green — #008000 — зеленый;

gray — #808080 — темно-серый

blue — #0000FF — синий;

navy — #000080 — темно-синий;

purple — #800080 — фиолетовый.

Обратите внимание

Тег является устаревшим и поддерживается только в формате Transitional. Использование его в формате Strict недопустимо.

Также для форматирования текста применяются и другие теги. Для вывода текста шрифтом большего размера используется парный тег :

Текст большего размера

А для вывода текста шрифтом меньшего размера применяется парный тег :

Текст меньшего размера

Для вывода текста моноширинным шрифтом используется тег :

1.5. Форматирование документа

Практически все теги, рассмотренные в предыдущем разделе, являются тегами физического форматирования. Исключение составляют теги и . Эти теги являются тегами логического форматирования текста и используются для выделения очень важных и просто важных фрагментов соответственно. Теги логического форматирования используются для структурной разметки документа и могут отображаться разными Web-браузерами по-разному. Перечислим основные теги логического форматирования:

. — применяется для отметки цитат, а также названий произведений;

. — служит для отметки фрагментов программного кода;

. — отмечает фрагмент как вводимый пользователем с клавиатуры;

. — используется для отметки коротких цитат;

. — применяется для отметки результата, выдаваемого программой;

. — отмечает имена переменных.

1.5.1. Тег комментария

Текст, заключенный между тегами , не отображается Web-браузером. Заметим, что это нестандартная пара тегов, т. к. открывающий тег не имеет закрывающей угловой скобки, а в закрывающем теге отсутствует открывающая угловая скобка:

Совет

Использование комментариев в исходном коде позволит быстро найти нужный фрагмент. Это особенно важно для начинающих Web-дизайнеров.

1.5.2. Перевод строки

Для разделения строк используется одинарный тег
.

Если в HTML-документе набрать текст

то Web-браузер отобразит его в одну строку: Строка1 Строка2 Строка3 . Для того чтобы строки располагались друг под другом, необходимо добавить тег
в конец каждой строки:

Для вывода текста в том же виде, что и в исходном коде, можно воспользоваться парным тегом

В этом примере строки также будут располагаться друг под другом.

1.5.3. Горизонтальная линия

Одинарный тег позволяет провести горизонтальную линию.

Тег имеет следующие параметры:

size — толщина линии:

width — длина линии. Можно указывать значение как в пикселах, так и в процентах относительно ширины окна Web-браузера:

align — выравнивание линии. Параметр может принимать следующие значения:

center — выравнивание по центру (значение по умолчанию):

2 w >200 color= red align= center >

left — выравнивание по левому краю:

2 w >200 color= red align= left >

right — выравнивание по правому краю:

2 w >200 color= red align= right >

noshade — присутствие этого параметра отменяет рельефность линии:

2 w >200 align= center noshade>

Обратите внимание

Все рассмотренные параметры тега являются устаревшими и поддерживаются только в формате Transitional. Использование их в формате Strict недопустимо.

1.5.4. Заголовки

Заголовки могут иметь шесть различных размеров:

где x — число от 1 до 6.

Заголовок с номером 1 является самым крупным:

Самый крупный заголовок

Заголовок с номером 6 является самым мелким:

Самый мелкий заголовок

Основным параметром является align, он задает выравнивание заголовка относительно окна Web-браузера. Он может принимать следующие значения:

center — выравнивание по центру:

center>Заголовок первого уровня с выравниванием по

left — выравнивание по левому краю (по умолчанию):

left>Заголовок второго уровня с выравниванием по

right — выравнивание по правому краю:

right>Самый мелкий заголовок с выравниванием по

Обратите внимание

Параметр align является устаревшим и поддерживается только в формате Transitional. Использование его в формате Strict недопустимо.

1.5.5. Разделение на абзацы

позволяет разбить текст на отдельные абзацы. Web-браузеры отделяют абзацы друг от друга пустой строкой. Закрывающий тег

Основным параметром является align, он задает горизонтальное выравнивание. Параметр может принимать следующие значения:

center — выравнивание по центру:

center>Абзац с выравниванием по центру

left — выравнивание по левому краю (по умолчанию):

left>Абзац с выравниванием по левому краю

right — выравнивание по правому краю:

right>Абзац с выравниванием по правому краю

justify — выравнивание по ширине (по двум сторонам):

justify>Абзац с выравниванием по ширине

Обратите внимание

Параметр align является устаревшим и поддерживается только в формате Transitional. Использование его в формате Strict недопустимо.

1.6. Списки

Список — это набор упорядоченных абзацев текста, помеченных специальными значками (маркированные списки) или цифрами (нумерованные списки). Рассмотрим каждый из вариантов в отдельности.

1.6.1. Маркированные списки

Маркированный список помещают внутри пары тегов

    и

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

Листинг 1.3. Маркированный список

Тег

    имеет параметр type, позволяющий задать значок, которым помечаются строки списка. Параметр может принимать следующие значения:

disc — значки в форме кружков с заливкой:

circle — значки в форме кружков без заливки:

square — значки в форме квадрата с заливкой:

Обратите внимание

Параметр type является устаревшим и поддерживается только в формате Transitional. Использование его в формате Strict недопустимо.

1.6.2. Нумерованные списки

Нумерованный список помещают внутри пары тегов

    и

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

В листинге 1.4 показана структура нумерованного списка.

Листинг 1.4. Нумерованный список

Тег

    имеет два параметра. Первый из них — type — позволяет задать формат, которым нумеруются строки списка.

Параметр может принимать следующие значения:

A — пункты нумеруются прописными латинскими буквами:

a — пункты нумеруются строчными латинскими буквами:

I — пункты нумеруются прописными римскими цифрами:

i — пункты нумеруются строчными римскими цифрами:

1 — пункты нумеруются арабскими цифрами (по умолчанию):

Второй параметр тега

    — start — задает номер, с которого будет начинаться нумерация строк:

Тег
также имеет параметр value, который позволяет изменить номер данного элемента списка:

В этом примере Первый пункт будет иметь номер 1, Второй пункт — номер 5, а Третий пункт — номер 6.

Обратите внимание

Параметры type, start и value являются устаревшими и поддерживаются только в формате Transitional. Использование их в формате Strict недопустимо.

1.6.3. Списки определений

Списки определений состоят из пар термин/определение . Описываются с помощью тега . Для вставки термина применяется тег , а для вставки определения — тег . Закрывающие теги и не обязательны. Пример использования списков определений приведен в листинге 1.5.

Листинг 1.5. Списки определений

-//W3C//DTD HTML 4.01//EN

Content-Type content= text/html; charset=windows-1251 >

HTML (HyperText Markup Language)

Язык разметки документа, описывающий форму отображения

информации на экране компьютера

CSS (Cascading Style Sheets)

Каскадные таблицы стилей

1.7. Графика

Применение графики делает Web-страницу визуально привлекательнее. Изображения помогают лучше передать суть и содержание документа. В Интернете применяются графические форматы:

GIF — использует только 256 цветов и поддерживает прозрачность. Кроме того, GIF-файл может содержать анимацию;

JPEG — метод сжатия фотографий с потерей качества. Прозрачность и анимация не поддерживаются;

PNG — формат хранения графики, использующий сжатие без потерь. Поддерживает прозрачность. Разрабатывался в качестве замены формата GIF.

Примечание

Загромождение документа графикой приводит к увеличению времени загрузки Web-страницы. По этой причине применяйте графику только там, где это действительно оправданно.

1.7.1. Изображение на Web-странице

Изображения вставляются в Web-страницы с помощью одинарного тега . Сам тег должен быть расположен внутри блочного тега, например,

Тег имеет следующие параметры:

src — URL-адрес файла графического изображения:

foto.gif alt= Текст подсказки >

http://www.mysite.ru/foto.gif alt= Текст подсказки >

alt — строка текста, которая будет выводиться на месте появления изображения до его загрузки или при отключенной графике, а также если изображение загрузить не удалось. Кроме того, при наведении курсора мыши на изображение текст, указанный в параметре alt, можно увидеть в качестве текста всплывающей подсказки:

foto.gif alt= Текст подсказки >

width — ширина изображения в пикселах:

foto.gif w >480 alt= Текст подсказки >

height — высота изображения в пикселах:

foto.gif w >480 height= 60 alt= Подсказка >

Примечание

Значения параметров width и height могут не соответствовать реальным размерам изображения. В этом случае Web-браузер выполнит перемасштабирование. Если значение одного из параметров указать неправильно, то изображение будет искажено. Если указать только один параметр, то значение второго будет рассчитано пропорционально значению первого исходя из реальных размеров изображения.

Совет

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

Следующие параметры доступны только при использовании формата Transitional:

border — толщина границы изображения:

foto.gif border= 0 alt= Текст подсказки >

align — расположение изображения относительно текста или других элементов Web-страницы. Параметр может принимать следующие значения:

left — изображение выравнивается по левому краю, а текст обтекает его с правой стороны:

foto.gif align= left alt= Подсказка >Текст

right — изображение выравнивается по правому краю, а текст обтекает его с левой стороны:

HTML, JavaScript, PHP и MySQL. Джентльменский набор Web-мастера.

Автор: Прохоренок Н.А.
ISBN: 978-5-9775-3986-9

1 527.00 руб.

Аннотация

Рассмотрены вопросы создания интерактивных Web-сайтов с помощью HTML, JavaScript, PHP и MySQL, форматирования Web-страниц при помощи CSS. Даны основы PHP и примеры написания типичных сценариев. Описаны приемы работы и администрирования баз данных MySQL при помощи PHP и программы phpMyAdmin. Особое внимание уделено созданию программной среды на компьютере разработчика и настройке Web-сервера Apache. В 5-м издании содержится описание возможностей, предлагаемых PHP 7.2, новых инструментов JavaScript (включая рисование на холсте, средства геолокации и локальное хранилище данных) и всех нововведений, появившихся в актуальных на данный момент версиях HTML, CSS, Apache, MySQL и технологии AJAX. Электронный архив содержит листинги примеров, а также руководство по созданию динамического сайта. 5-е издание, переработанное и дополненное.

HTML, javascript, PHP и MySQL. Джентльменский набор Web-мастера, 4-е издание (2015)

Автор: Н. Прохоренок, В. Дронов
Издательство: БХВ-Петербург
Год: 2015
Страниц: 766
Перевод: Русский
Формат: pdf
Размер 91.7 Мб

Содержание Рассмотрены вопросы создания интерактивных Web-сайтов с помощью НТML, javascript, PHP и MySQL, форматирования Web-страниц при помощи CSS. Даны основы РНР и примеры написания типичных сценариев.
Подробнее

Понравилась статья? Поделиться с друзьями:
Кодинг, CSS и SQL