Итоговый урок

Ура! Каникулы

Тест словарного запаса (Тест определяет ваш пассивный словарный запас, или, говоря проще, количество известных вам слов русского языка. )

Как воплотить свою идею:

Лучшая монета никогда не расходуется (видео)
Что такое Сторителлинг

Распорядок жизни великих людей 

Урок 32. HTML. Самостоятельная работа

В самостоятельную  работу включены вопросы по оформлению текста на WEB-странице

Вы должны выполнить два задания:

1. написать теги для оформления текста по заданному образцу, включая структурные теги html документа - html, head, body
2. нарисовать вид WEB-страницы по заданной разметке

Работу выполняйте в тетради для контрольных работ

Задание

• Вариант 1 
• Вариант 2 

Урок 32. Изображение на WEB-странице

Материалы к уроку

Урок  5  курса Дуванова А.А.

ссылка работает только в школе

Картинка в тексте

Картинку можно помещать в документ почти так же, как текстовый символ. Для вставки этого необычного знака нужно воспользоваться командой IMG.  Команда не имеет парного закрывающего тега, но имеет много атрибутов. 

Атрибут src = имя файла

Самым главным атрибутом команды является атрибут src, при помощи которого можно задать имя файла с картинкой. Например, команда <IMG src=img.gif> заставит браузер отобразить на экране графический файл img.gif из текущего каталога. 

Обычно графические файлы не смешивают с HTML-текстами, а помещают в отдельный каталог pic, который является подкаталогом для каталога с программами (html-файлами). Тогда команда вывода графики будет иметь вид: <IMG src=./pic/img.gif> 

Атрибут alt = "текст надписи"

Если браузер не находит картинки в указанном месте на диске, он вместо нее рисует на экране маленький прямоугольник и вписывает в него надпись, которая задана атрибутом alt:

<IMG src=monstr.jpg alt="Страшный зверь"> 

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

Атрибут title = "текст надписи"

Аналогичен alt, но более современен

Атрибуты width = n и height = m

Эти атрибуты задают ширину и высоту (в пикселах) прямоугольника, в который выводится картинка. 

Если атрибуты не заданы, картинка рисуется в естественных размерах. 

Атрибут border = n

Атрибут позволяет задать рамку иллюстрации толщиной в n пикселов. При отсутствии атрибута, или при значении n=0 рамка не рисуется. 

Атрибут align

Этот атрибут позволяет определять положение иллюстрации по отношению к соседним элементам документа. 

Практическая работа 

Урок 31. Списки в таблице на WEB-странице

Повторение. Вложенные списки

На прошлом уроке нужно было построить вложенный список вида:

1. Введение
2. Что такое информатика ?
3. Что такое информация ?
4. Что такое вычислительная машина ?
• Общие положения
• Подробнее о памяти
• Ввод-вывод
• Оперативная память, внешняя память
• Порядок некоторых величин
5. Что может делать вычислительная машина?
6. Что такое программирование?
7. Несколько ключевых слов.

Внешний список - нумерованный. Вложенный - маркированный. 

Нумерация внешнего списка правильно продолжается после вложенного.

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

<ol type=1>
	<li>Введение</li>
	<li>Что такое информатика ?</li>
	<li>Что такое информация ?</li>
	<li>Что такое вычислительная машина ?</li>
	<ul>
	<li>Общие положения</li>
	<li>Подробнее о памяти</li>
	<li>Ввод-вывод</li>
	<li>Оперативная память, внешняя память</li>
	<li>Порядок некоторых величин</li>
	</ul>
	<li> Что может делать вычислительная машина?</li>
	<li>Что такое программирование?</li>
	<li>Несколько ключевых слов.</li>
</ol>

Повторение. Оформление таблицы

Для создания таблицы применяются теги
<TABLE border=1> 
<CAPTION> Заголовок таблицы </CAPTION> <TR>            <!-- строка -->   
<TD>1,1</TD>     <!-- ячейка -->     
</TR>  <!-- конец строки --> 
</TABLE> <!-- конец таблицы --> 

Для размещения в ячейки таблицы объектов нужно использовать теги для создания этих объектов.
Практическая работа