Презентация Технология создания Web-страниц. Интернет и WWW. Язык HTML. Выход онлайн
На нашем сайте вы можете скачать и просмотреть онлайн доклад-презентацию на тему Технология создания Web-страниц. Интернет и WWW. Язык HTML. Выход абсолютно бесплатно. Урок-презентация на эту тему содержит всего 66 слайдов. Все материалы созданы в программе PowerPoint и имеют формат ppt или же pptx. Материалы и темы для презентаций взяты из открытых источников и загружены их авторами, за качество и достоверность информации в них администрация сайта не отвечает, все права принадлежат их создателям. Если вы нашли то, что искали, отблагодарите авторов - поделитесь ссылкой в социальных сетях, а наш сайт добавьте в закладки.
Презентации » Устройства и комплектующие » Технология создания Web-страниц. Интернет и WWW. Язык HTML. Выход
Оцените!
Оцените презентацию от 1 до 5 баллов!
- Тип файла:ppt / pptx (powerpoint)
- Всего слайдов:66 слайдов
- Для класса:1,2,3,4,5,6,7,8,9,10,11
- Размер файла:1.32 MB
- Просмотров:98
- Скачиваний:0
- Автор:неизвестен
Слайды и текст к этой презентации:
№5 слайд
![Базовые принципы работы WWW](/documents_6/c59533b84ad792005492ef1a4cdcae65/img4.jpg)
Содержание слайда: Базовые принципы работы WWW
Отсутствие каких-либо централизованных органов управления и контроля. WWW никому не принадлежит.
Универсальность, стандартность и аппаратная независимость протоколов обмена данными
HTTP (Hypertext Transfer Protokol) – протокол передачи гипертекстовых файлов. Используется для передачи HTML-файлов по сети Web-страниц
URL (Universal Resource Locator) – Унифицированный указатель информационного ресурса.
HTML (HyperText Markup Language) – стандартный язык для создания Web-страниц
Динамическое согласование форматов документов
№7 слайд
![Web-страница это текстовый](/documents_6/c59533b84ad792005492ef1a4cdcae65/img6.jpg)
Содержание слайда: Web-страница – это текстовый файл с управляющими дескрипторами языка HTML
Файлы Web-станиц содержатся на Web-серверах
Для из просмотра используются программы-обозреватели: Microsoft Internet Explorer, Netscape Navigator
Web-сервером может быть любой компьютер, подключенный к Internet, на который установлено специальное ПО, например, Apache или IIS
№11 слайд
![Рекомендации Время загрузки](/documents_6/c59533b84ad792005492ef1a4cdcae65/img10.jpg)
Содержание слайда: Рекомендации
Время загрузки страницы не должно превышать 5 секунд
Время загрузки зависит от размера страницы и от скорости подключения компьютера пользователя:
аналоговый модем за 5 сек – 20 Кбайт,
кабельный модем или ISDN – за 5 сек – 60-80 Кбайт
Чем важнее страница и чем чаще она должна появляться, тем быстрее она должна загружаться.
№14 слайд
![Работа с текстом lt FONT SIZE](/documents_6/c59533b84ad792005492ef1a4cdcae65/img13.jpg)
Содержание слайда: Работа с текстом
<FONT SIZE = ‘1-7’ – установка размера шрифта
<H1-6> ваш заголовок </H1-6>
<P> ваш текст </P> - создание абзаца
ALIGN=“left” – выравнивание текста по левой стороне
ALIGN=“right” – выравнивание текста по правой стороне
ALIGN=“center” – выравнивание теста по центру
ALIGN=“justify” - выравнивание теста по ширине
<nobr> …<nobr> - не позволяет разрывать текст на строке
<BR> - прерывание текста, перенос на следующую строку
<B> ..</B> - жирный
<I> ..</I> - курсив
<U> ..</U> - подчеркивание
<strike> ..</strike> - перечеркивание
№15 слайд
![Выравнивание текста абзаца lt](/documents_6/c59533b84ad792005492ef1a4cdcae65/img14.jpg)
Содержание слайда: Выравнивание текста абзаца
<B0DY>
<Р ALIGN="left" >Абзац выровнен влево</Р>
<Р ALIGN="center" >Абзац выровнен по центру</Р>
<Р ALIGN="right" >Абзац выровнен вправо</Р>
<Р ALIGN="justify" >Абзац выровнен по ширине</Р>
<P><N0BR>Этотoт текст всегда должен оставаться в одной строке</NOBR></P>
</BODY>
№18 слайд
![Текст пункта списка должен](/documents_6/c59533b84ad792005492ef1a4cdcae65/img17.jpg)
Содержание слайда: Текст пункта списка должен быть в пределах нескольких строк, иначе список перестает восприниматься как одно целое и теряется смысл его применения.
Текст пункта списка должен быть в пределах нескольких строк, иначе список перестает восприниматься как одно целое и теряется смысл его применения.
По умолчанию пункты списка нумеруются последовательно цифрами 1, 2, 3 и т.д.
Чтобы изменить способ нумерации пунктов списка, воспользуйтесь атрибутами TYPE, START и VALUE.
Тип нумерованного списка устанавливается с помощью атрибута type дескриптора <OL>.
Значения атрибута TYPE
№19 слайд
![Некоторые номера списка могут](/documents_6/c59533b84ad792005492ef1a4cdcae65/img18.jpg)
Содержание слайда: Некоторые номера списка могут быть пропущены, и текущему пункту, заданному дескриптором <LI>, присваивается номер с помощью атрибута VALUE.
Некоторые номера списка могут быть пропущены, и текущему пункту, заданному дескриптором <LI>, присваивается номер с помощью атрибута VALUE.
Все следующие пункты списка будут нумероваться последова-тельно, начиная с номера, заданного в атрибуте VALUE.
<Н2>Управление нумерацией пунктов списка</Н2>
<OL START='3'>
<LI>Haчнем список с пункта 3</LI>
<LI>Cлeдующий пункт cпискa</LI>
<LI VALUE='7'>Продолжим список с пункта 7</LI>
<LI>Следующий пункт cпискa</LI>
</OL>
№22 слайд
![Многоуровневый список lt H gt](/documents_6/c59533b84ad792005492ef1a4cdcae65/img21.jpg)
Содержание слайда: Многоуровневый список
<H2>Многоуровневые списки</Н2>
<OL>
<LI>Нумерованный</LI >
<OL>
<LI >Пункт 1</LI >
<LI >Пункт 2</LI >
<LI >Пункт 3</LI >
</OL>
< LI >Маркированный</LI >
<UL>
<LI >Первый вариант</LI >
<LI >Второй вариант</LI >
<LI >Третий вариант</LI >
</UL>
< LI >Смешанный</LI >
<OL type="a">
<LI >Пункт a</LI>
<LI >Пункт b</LI>
<LI >Пункт c</LI>
</OL>
</OL>
№26 слайд
![Бегущая строка lt MARQUEE gt](/documents_6/c59533b84ad792005492ef1a4cdcae65/img25.jpg)
Содержание слайда: Бегущая строка <MARQUEE> </MARQUEE>
BEHAVIOR — способ выполнения эффекта бегущей строки:
scroll — текст исчезает за краем Web-страницы;
slide — после выполнения заданного числа циклов, текст остается у левого или правого поля Web-страницы;
alternate — направление перемещения текста в строке меняется на противоположное после выполнения каждого цикла.
BGCOLOR — цвет фона бегущей строки
Direction— направление перемещения текста:
left — влево;
right — вправо.
HEIGHT — высота бегущей строки.
hspace — отступ в пикселях текста бегущей строки от левого и правого полей Web-страницы.
№27 слайд
![LOOP число показов текста в](/documents_6/c59533b84ad792005492ef1a4cdcae65/img26.jpg)
Содержание слайда: LOOP — число показов текста в строке:
LOOP — число показов текста в строке:
? — целочисленное значение, указывающее число повторов;
infinite — бесконечное повторение эффекта по циклу.
SCROLLAMOUNT — смещение текста в пикселях за один шаг.
SCROLLDELAY — временной промежуток между смещениями в миллисекундах, по умолчанию 60 мс. Используйте этот атрибут, чтобы замедлить перемещение текста в строке
vspace — отступ в пикселях по вертикали от текста до рамки бегущей строки.
TRUESPEED — минимальное значение смещения текста, по умолчанию 60 мс.
WIDTH — ширина бегущей строки в пикселях.
№29 слайд
![Специальные символы Вам может](/documents_6/c59533b84ad792005492ef1a4cdcae65/img28.jpg)
Содержание слайда: Специальные символы
Вам может понадобиться использовать в тексте Web-страницы символы, которые зарезервированы в качестве служебных в языке HTML, например <, > и &,
или символы, которые не могут быть введены непосредственно с клавиатуры.
Для добавления в текст специальных символов используется числовой или именной код. В обоих случаях код символа начинается с символа амперсанда (&), за которым следует номер символа (числовой код из кодовой таблицы ASCII) или сокращенное имя (именной код).
№31 слайд
![Выравнивание рисунка и текста](/documents_6/c59533b84ad792005492ef1a4cdcae65/img30.jpg)
Содержание слайда: Выравнивание рисунка и текста страницы
Для выравнивания рисунка относительно текста документа атрибуту ALIGN присваивается следующие значения:
LEFT – рисунок выравнивается по левому краю
RIGHT – рисунок выравнивается по правому краю
Для выравнивания текста абзаца, в который добавлен рисунок, атрибуту ALIGN присваивается следующие значения:
TOP – текст выравнивается по верхнему краю рисунка
MIDLE – текст выравнивается по средней линии рисунка
BOTTOM – текст выравнивается по нижнему краю рисунка
№37 слайд
![Гиперссылка на звуковые файлы](/documents_6/c59533b84ad792005492ef1a4cdcae65/img36.jpg)
Содержание слайда: Гиперссылка на звуковые файлы и видео клипы
MIDI – музыкальные произведения в файлах с расширением .mid
MP3 – музыка, звуковые сообщения в файлах с расширением .mp3
RealAudio – интерактивное радио и звукозапись в файлах с расширением .ra
WAV – звуковые эффекты в файлах с расширением .wav
AVI – клипы с расширением .avi
MPEG – клипы с расширением .mpg или .mpeg
QuickTime – небольшие клипы в файлах с расширением .mov или .gt
Например:
<A HREF=‘музыка.mp3’ Щелкните здесь, чтобы прослушать звуковой файл
</A>
№41 слайд
![Дескрипторы создания таблицы](/documents_6/c59533b84ad792005492ef1a4cdcae65/img40.jpg)
Содержание слайда: Дескрипторы создания таблицы:
<Table> … </Table>
<TR> …</TR> - новая строка
<TH> … </TH> - ячейка заголовка
<TD> … </TD> - обычная ячейка
По умолчанию текст в ячейках заголовка показан полужирным шрифтом с выравниванием по центру
Текст в обычных ячейках не выделяется и выравнивается по левому краю
№46 слайд
![По умолчанию заголовок](/documents_6/c59533b84ad792005492ef1a4cdcae65/img45.jpg)
Содержание слайда: По умолчанию заголовок выравнивается по центру таблицы.
По умолчанию заголовок выравнивается по центру таблицы.
Чтобы изменить выравнивание влево или вправо, присвойте атрибуту ALIGN в дескрипторе <CAPTION> значение left или right.
Атрибуту ALIGN также можно присвоить значение bottom. В этом случае заголовок появится под таблицей.
В принципе в таблице допускается создание нескольких заголовков, но лучше этого не делать. Так, в обозревателе Netscape Navigator дескриптор <caption> может произвольно изменить порядок заголовков.
№48 слайд
![Использование в таблице](/documents_6/c59533b84ad792005492ef1a4cdcae65/img47.jpg)
Содержание слайда: Использование в таблице фоновых изображений
Фоновый рисунок устанавливается в атрибуте BACKGROUND.
Этот атрибут можно установить как для всей таблицы в дескрипторе <TABLE>, так и для отдельной ячейки в дескрипторах <td> и <тн>. Соответственно, если в первом случае рисунок будет помещен в фоне всей таблицы, то во втором случае — только в фоне данной ячейки. Если разные фоновые рисунки были назначены таблице и ячейке, то фоновый рисунок ячейки появится поверх рисунка таблицы.
Требования к фоновым рисункам таблицы такие же, как и к фону Web-страницы, — фон не должен мешать чтению текста и восприятию информации.
№49 слайд
![Однако! Следует учесть, что](/documents_6/c59533b84ad792005492ef1a4cdcae65/img48.jpg)
Содержание слайда: Однако!
Следует учесть, что разные обозреватели по-разному отображают фоновые рисунки, назначенные всей таблице.
Если Internet Explorer заполняет копиями изображения все пространство таблицы, так же, как фоновый рисунок страницы заполняет все окно обозревателя, то Netscape Navigator повторит рисунок в каждой ячейке.
В связи с этим лучше воздержаться от использования фоновых рисунков таблицы.
№51 слайд
![Размеры ячеек устанавливаются](/documents_6/c59533b84ad792005492ef1a4cdcae65/img50.jpg)
Содержание слайда: Размеры ячеек устанавливаются с помощью атрибутов width и height и две ячейки в первом столбце объединяются с помощью атрибута ROWSPAN.
Размеры ячеек устанавливаются с помощью атрибутов width и height и две ячейки в первом столбце объединяются с помощью атрибута ROWSPAN.
Обратите внимание на следующий важный момент: в дескрипторе <table> атрибутам
border, cellpadding и CELLSPACING
присвоено значение 0.
Благодаря этому не видны границы между фоновыми рисунками в ячейках и выравнивание текста заголовка в верхней панели совпадает с выравниванием фонового рисунка.
№52 слайд
![Прорисовка границ таблицы По](/documents_6/c59533b84ad792005492ef1a4cdcae65/img51.jpg)
Содержание слайда: Прорисовка границ таблицы
По умолчанию обозреватели не показывают границы вокруг таблицы и между ячейками. Это вполне подходит, если таблица используется для разметки макета документа. Если же нужно представить данные в форме таблицы, то прорисовка границ усилит зрительный эффект и поможет пользователям лучше понять взаимосвязи данных в ячейках таблицы.
№54 слайд
![Обратите внимание, что](/documents_6/c59533b84ad792005492ef1a4cdcae65/img53.jpg)
Содержание слайда: Обратите внимание, что атрибут BORDER изменяет вид только внешней границы вокруг таблицы, тогда как внутренние границы между ячейками не меняются.
Для изменения внутренних границ используются атрибуты CELLPADDING и CELLSPACING.
По умолчанию обозреватели показывают границы серым цветом. Чтобы изменить цвет, воспользуйтесь атрибутом BORDERCOLOR.
Установка данного атрибута изменит цвет как внешних, так и внутренних границ. При этом исчезнет эффект объемности границ
Чтобы убрать границы, присвойте атрибуту BORDER значение 0, или просто удалите этот атрибут из дескриптора <TABLE>.
№55 слайд
![Выборочная прорисовка границ](/documents_6/c59533b84ad792005492ef1a4cdcae65/img54.jpg)
Содержание слайда: Выборочная прорисовка границ
Установив атрибут BORDER, можно либо показать все границы, либо не показывать границ.
Однако, часто нужно показать только внешние или только внутренние границы, но лишь вокруг определенных ячеек.
Для выборочной прорисовки границ используются атрибуты FRAME и RULES в дескрипторе <TABLE>
№57 слайд
![Выборочная прорисовка границ](/documents_6/c59533b84ad792005492ef1a4cdcae65/img56.jpg)
Содержание слайда: Выборочная прорисовка границ
<table frame=‘hsides’ rules=‘cols’>
♦ FRAME — устанавливает показ внешних границ таблицы:
void — нет внешних границ;
above — граница по верхнему краю таблицы;
below — граница по нижнему краю таблицы;
rhs — граница по правому краю таблицы;
lhs — граница по левому краю таблицы; •
hsides — границы по верхнему и нижнему краям таблицы;
vsides — границы по левому и правому краям таблицы;
border — все границы (задано по умолчанию).
♦ RULES — устанавливает показ внутренних границ таблицы:
none — нет внутренних границ;
cols — границы между столбцами;
rows — границы между строками;
groups — границы между группами столбцов и строк;
all — все внутренние границы (задано по умолчанию).
№58 слайд
![Группирование и объединение](/documents_6/c59533b84ad792005492ef1a4cdcae65/img57.jpg)
Содержание слайда: Группирование и объединение ячеек таблицы
Существует ряд дескрипторов кода HTML, которые предназначены для группирования ячеек таблицы. Это удобная функция, позволяющая форматировать группы ячеек как одно целое, вместо того чтобы устанавливать атрибуты в дескрипторе каждой индивидуальной ячейки.
Установки атрибутов форматирования в индивидуальных ячейках имеют более высокий приоритет и отменяют установки для всей группы.
Кроме того, можно объединить несколько ячеек в одну ячейку, которая будет занимать несколько столбцов или строк.
№59 слайд
![Объединение ячеек Иногда](/documents_6/c59533b84ad792005492ef1a4cdcae65/img58.jpg)
Содержание слайда: Объединение ячеек
Иногда бывает необходимо создать в таблице ячейку, занимающую несколько столбцов или строк. Это особенно важно при выполнении разметки макета страницы с помощью таблицы.
Для объединения ячеек в дескрипторах <TD> и <ТН> устанавливаются следующие параметры:
COLSPAN - число столбцов, занятых ячейкой;
ROWSPAN — число строк, занятых ячейкой.
№60 слайд
![Группирование столбцов Для](/documents_6/c59533b84ad792005492ef1a4cdcae65/img59.jpg)
Содержание слайда: Группирование столбцов
Для группирования столбцов используются следующие дескрипторы:
♦ < COLGROUP > - структурная группа столбцов, применяется для разбивки таблицы на столбцы разных типов, например: столбец заголовков и столбцы данных;
♦ <COL> — неструктурная группа столбцов, применяется для произвольного группирования столбцов таблицы, имеющих общий формат данных.
Дескрипторы <C0LGROUP> И <COL> содержат набор атрибутов форматирования ячеек. Так, установка атрибута BGCOLOR в дескрипторе группы столбцов изменит цвет фона во всех ячейках, относящихся к группе.
№61 слайд
![Группирование строк Для](/documents_6/c59533b84ad792005492ef1a4cdcae65/img60.jpg)
Содержание слайда: Группирование строк
Для группирования строк используются следующие дескрипторы:
♦ <THEAD> — создает группу строк заголовков, этот дескриптор можно использовать в коде таблицы только один раз;
<TBODY> — используется для создания одной или нескольких групп строк;
♦ <TFOOT> — создает группу строк нижнего колонтитула таблицы, этот дескриптор можно использовать в коде таблицы только один раз. Все дескрипторы группирования строк являются парными.
№65 слайд
![Выравнивание таблиц в тексте](/documents_6/c59533b84ad792005492ef1a4cdcae65/img64.jpg)
Содержание слайда: Выравнивание таблиц в тексте документа
Выравнивание таблицы в тексте документа осуществляется с помощью атрибута ALIGN. Этому атрибуту присваиваются следующие значения:
left — таблица выравнивается по левому краю окна с обтеканием текста справа от таблицы;
right — таблица выравнивается по правому краю окна с обтеканием текста слева от таблицы;
all — таблица выравнивается по центру окна с обтеканием текста справа и слева от таблицы (поддерживается не всеми обозревателями);
center — таблица выравнивается по центру окна, разрывая текст на блоки над и под таблицей.
Чтобы выровнять фрагмент текста слева или справа от таблицы, а остальной текст продолжить ниже таблицы, введите дескриптор <BR> с установленным атрибутом CLEAR:
<BR CLEAR='left'>
Атрибуту clear присваивается значение left или right, такое же, какое было присвоено атрибуту align таблицы.
Скачать все slide презентации Технология создания Web-страниц. Интернет и WWW. Язык HTML. Выход одним архивом:
Похожие презентации
-
Основы Web - технологий. Языки разметок и стилей: HTML. Часть 2
-
Основы языка Java. Введение в Web-технологии Java SE, Java EE, Java ME
-
HTML. Создание Web-сайта
-
Верстка макета рекламной веб-страницы «Мастер ЦМИ» с помощью языка гипертекстовой разметки HTML и стилей CSS
-
Web-технологии: HTML, CSS, JavaScript, JQuery
-
Основы web-технологий. Технологии создания web-сайтов
-
HTML 5. Развитие Web-Технологий
-
Язык разметки гипертекста HTML. 8 класс
-
Технология создания программ с использованием алгоритмической структуры «развилка»
-
Технология создания презентаций с помощью сервиса Prezi. com