Меню
Разработки
Разработки  /  Информатика  /  Проверочные работы  /  Создание своей Web-страницы: форматирование текста, вставка рисунков

Создание своей Web-страницы: форматирование текста, вставка рисунков

Цель работы: закрепить теоретические знания и приобрести практические навыки работы создания Web-страниц с помощью языка HTML.
16.03.2013

Описание разработки

Цель работы: закрепить теоретические знания и приобрести практические навыки работы  создания Web-страниц с помощью языка HTML

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

HTML – (язык разметки гипертекста) – это простой набор команд, описывающих структуру документа, отдельные его логические части: заголовки, абзацы, таблицы.

Структура  Web-страницы:

<html>

<head>

,   ,   ,

head>

<body >

,   ,   ,

body>

html>

Поясним значения тегов: - смотри документ 

Имя

Цвет

Числовое значение

Имя

Цвет

Числовое значение

black

Черный

“#000000”

green

Зеленый

“#008000”

silver

Серебро

“#c0c0c0”

lime

Светло-зеленый

“#00ff00”

grey

Серый

“#808080”

olive

Оливковый

“#808000”

white

Белый

“#ffffff”

yellow

Желтый

“#ffff00”

maroon

Каштановый

“#800000”

navy

Темно-синий

“#000080”

red

Красный

“#ff0000”

blue

Синий

“#0000ff”

purple

Фиолетовый

“#800080”

teal

Сине-серый

“#008080”

fuchsia

Сиреневый

“#ff00ff”

agua

Голубой

“#00ffff”

Теги работающие со шрифтами: - смотри документ.

Ход выполнения практической работы

Создать на Рабочем столе папку  Web.

В Блокноте набить файл. - смотри документ

Сохранить файл в папке  Web под именем My.html.

Просмотреть полученную  Web - страницу.

Скопировать в папку  Web рисунок Priroda.gif.

Если на ПЭВМ нет такого рисунка, то:

 а) скопировать в папку  Web любой другой рисунок, сохранив его расширение;

б) имя рисунка д.б. на английском языке;

в) заменить имя рисунка Priroda.gif   на имя внедряемого рисунка.

Просмотреть полученную  Web - страницу.

Создать страницу spisok.html - смотри документ

Содержание отчёта:

  1. Название практической работы
  2. Фамилия и номер группы
  3. Цель практической работы
  4. Структура Web-страницы
  5. Значения тегов,  работающих со шрифтами, фоном страницы, списком.
  6. Значения тегов,  управляющих положением элемента на Web-странице.

Контрольные вопросы:

  1. Дайте определение языку HTML?
  2. Какую структуру имеют  Web-страницы?
  3. Перечислите теги,  работающие со шрифтами.
  4. Какие теги управляют цветом шрифта, фоном страницы?
  5. Какие теги управляют положением элемента на Web-странице?
  6. Перечислите теги, работающие со списком.

Содержимое разработки

Методические рекомендации к проведению практической работы «Создание своей Web-страницы: форматирование текста, вставка рисунков»


Цель работы: закрепить теоретические знания и приобрести практические навыки работы создания Web-страниц с помощью языка HTML


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


HTML – (язык разметки гипертекста) – это простой набор команд, описывающих структуру документа, отдельные его логические части: заголовки, абзацы, таблицы.


Структура Web-страницы:

html

head

, , ,

head

body

, , ,

body

html

Поясним значения тегов:

html html Ограничивает Web- страницу (начало и конец документа)

head head Ограничивает заголовок

body body Ограничивает тело дркумента

titletitle - задает обязательный заголовок документа

meta - информация о документе (авторство, дата и т.п.)

img - внедряет изображение в текущий документ по адресу.

pp - представление обычного текстового абзаца

br - принудительный переход на новую строку

Align=left | center | rightзадает положение текста относительно документа

Bgcolor=[цвет] – устанавливает цвет фона документа


Имя

Цвет

Числовое значение

Имя

Цвет

Числовое значение

black

Черный

“#000000”

green

Зеленый

“#008000”

silver

Серебро

“#c0c0c0”

lime

Светло-зеленый

“#00ff00”

grey

Серый

“#808080”

olive

Оливковый

“#808000”

white

Белый

“#ffffff”

yellow

Желтый

“#ffff00”

maroon

Каштановый

“#800000”

navy

Темно-синий

“#000080”

red

Красный

“#ff0000”

blue

Синий

“#0000ff”

purple

Фиолетовый

“#800080”

teal

Сине-серый

“#008080”

fuchsia

Сиреневый

“#ff00ff”

agua

Голубой

“#00ffff”


Теги работающие со шрифтами:

uu - представляет текст подчеркнутым шрифтом

bigbig - представляет текст крупным шрифтом

bb - полужирное начертание текста

ii - курсивное начертание текста

tttt - телетайпный текст

strikestrike -представление текста перечеркнутым шрифтом

или ss - то же –«-

strongstrong - для сильного подчеркивания

h1…h1 - заголовок 1-го уровня

h6…h6 - заголовок 6-го уровня

size = [число] – устанавливает размер шрифта ( от 1 до 7)

Text = [цвет] - устанавливает цвет текста в документе

divdiv - разделяет документ так, что тк различным частям документа м.б. применены различные варианты выравнивания.


Ход выполнения практической работы


1. Создать на Рабочем столе папку Web.

2. В Блокноте набить файл.


html

Компания Геотон


Добро пожаловать на страничку компании Геотонbr



p style="font-weigt:bold; font-style:italic; font-size:150%; text-align:center"Здесь вы узнаетеbr br о нашей деятельности ,br о програмных продуктах нашей компании br и об оборудовании, которое мы производимp

body

html


  1. Сохранить файл в папке Web под именем My.html.

  2. Просмотреть полученную Web - страницу.

  3. Скопировать в папку Web рисунок Priroda.gif.

Если на ПЭВМ нет такого рисунка, то:

а) скопировать в папку Web любой другой рисунок, сохранив его расширение;

б) имя рисунка д.б. на английском языке;

в) заменить имя рисунка Priroda.gif на имя внедряемого рисунка в строке:





7. Просмотреть полученную Web - страницу.

8. Создать страницу spisok.html:


Чем мы занимаемся?

H2 align=centerЧем мы занимаемся?H2

br

UL

LIсщзданием новых и развитием существующих АСУ технологическими процессами на пролмышленных объектах.

LIПланированием и установкой "под ключ" локальных и глобальных ВС.

LIРазработкой и внедрением систем корпоративных сетей с построением кабельных систем (для офисов, а также систем передачи данных с использованием телефонных, оптоволоконных и кабельных каналов.

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

LIСозданием систем слижения и видеонаблюдения.

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

UL

br

P align=centerЕсли у вас есть вопросы или предложения, напишите нам:P


На первую страницу

BODY

HTML

Содержание отчёта:

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

2.Фамилия и номер группы

3. Цель практической работы

4. Структура Web-страницы

9. Значения тегов, работающих со шрифтами, фоном страницы, списком.

8. Значения тегов, управляющих положением элемента на Web-странице.

Контрольные вопросы:

  1. Дайте определение языку HTML?

  2. Какую структуру имеют Web-страницы?

  3. Перечислите теги, работающие со шрифтами.

  1. Какие теги управляют цветом шрифта, фоном страницы?

  2. Какие теги управляют положением элемента на Web-странице?

  3. Перечислите теги, работающие со списком.

-75%
Курсы повышения квалификации

Использование информационных технологий в процессе обучения в условиях реализации ФГОС

Продолжительность 72 часа
Документ: Удостоверение о повышении квалификации
4000 руб.
1000 руб.
Подробнее
Скачать разработку
Сохранить у себя:
Создание своей Web-страницы: форматирование текста, вставка рисунков (51.5 КB)

Комментарии 0

Чтобы добавить комментарий зарегистрируйтесь или на сайт

© 2008-2024, ООО «Мультиурок», ИНН 6732109381, ОГРН 1156733012732

Учителю!
Огромная база учебных материалов на каждый урок с возможностью удаленного управления
Тесты, видеоуроки, электронные тетради