Форматирование текста на Web-странице

  • Презентации учебные
  • ppt
  • 26.04.2020
Публикация на сайте для учителей

Публикация педагогических разработок

Бесплатное участие. Свидетельство автора сразу.
Мгновенные 10 документов в портфолио.

Пока страница не слишком привлекательна: мелкий шрифт и черный текст на белом фоне. Но с помощью тэгов можно украсить текст. 1. Заголовки: тэги от <Н1> (самый крупный) до <Н6> (самый мелкий). <Н1> Всё о компьютере </Н1> 2. Шрифт (FONT). Некоторые тэги имеют атрибуты - имена свойств, могут принимать определенные значения. FONT face=“Arial” – гарнитура шрифта size=4 – размер color=“red” – цвет 3. Выравнивание (ALIGN). Текст обычно выравнивается по левому краю страницы, однако принято заголовок размещать по центру. ALIGN =“left", <FONT COLOR=“blue” ALIGN="right", <Н1 ALIGN="center"> Bcё о компьютере </Н1> ALIGN="center" </FONT>
Иконка файла материала Форматирование текста Web страницы. Вставка изображений 8 кл.ppt

Разработка Web-сайтов с использованием языка разметки гипертекста HTML

Программы для создания сайта:

1) простейший текстовый редактор (без форматирования текста): Блокнот
2) браузер для просмотра страниц:
Internet Explorer
3) программа обработки изображений:
Photoshop

Как сохранить веб-страницу

1. Cоздать для сайта специальную папку и сохранять все файлы сайта в этой папке.

2. Web-страницу сохранить в виде файла с именем index.html - это титульный лист сайта (первым загружается в браузер)
Расширения файла Web-страницы – .htm или .html

Создаем свой сайт….

Нужно различать имя файла index.html - под которым Web-страница хранится в файловой системе, и собственно имя Web-страницы «Компьютер» - высвечивается в верхней строке окна браузера и в первую очередь анализируется поисковыми системами.
Имя Web-страницы должно в максимальной степени соответствовать ее содержанию.

1. В Блокнот ввести HTML-код Web-страницы.
2. Сохранить файл под именем index.html в папке сайта. Выбрать тип файла – «Все файлы».
3. Открыть этот файл в браузере для просмотра.

Форматирование текста на Web-странице

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

Пока страница не слишком привлекательна: мелкий шрифт и черный текст на белом фоне. Но с помощью тэгов можно украсить текст.

1. Заголовки: тэги от <Н1> (самый крупный) до <Н6> (самый мелкий). <Н1> Всё о компьютере

2. Шрифт (FONT). Некоторые тэги имеют атрибуты - имена свойств, могут принимать определенные значения.
FONT face=“Arial” – гарнитура шрифта
size=4 – размер
color=“red” – цвет

3. Выравнивание (ALIGN). Текст обычно выравнивается по левому краю страницы, однако принято заголовок размещать по центру.
ALIGN =“left",
ALIGN="right", <Н1 ALIGN="center"> Bcё о компьютере
ALIGN="center"

Цвет шрифта


Значение атрибута COLOR можно задать 2-мя способами:
а) названием цвета (например, "red", "green", "blue" и так далее),
б) его шестнадцатеричным значением в RGB-формате "#RRGGBB", где две первые шестнадцатеричные цифры задают интенсивность красного (red), две следующие — интенсивность зеленого (green) и две последние — интенсивность синего (blue) цветов.
Минимальная интенсивность цвета задается шестнадцатеричным числом 00, а максимальная — FF. Синий цвет = "#0000FF".

Таким образом, задать синий цвет заголовка можно тэгом FONT с атрибутом COLOR:
<Н1 ALIGN="center">Bcё о компьютере

4. Горизонтальная линия отделит заголовок от остального содержания страницы с помощью одиночного тэга


.

5. Абзацы: <Р>. При просмотре в браузере абзацы отделяются друг от друга интервалами. Для каждого абзаца можно задать определенный тип выравнивания.

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

Вставка изображений в Web-страницы

Вставка изображений

На Web-страницах могут быть графические файлы 3 форматов — GIF, JPG и PNG. Если рисунок сохранен в другом формате, то его необходимо предварительно преобразовать в один из этих форматов.

Для вставки изображения используется тэг с атрибутом SRC, который указывает на место хранения файла на локальном компьютере или в Интернете.
1) картинка на локальном компьютере в папке с сайтом:

2) картинка в другой папке на локальном компьютере:

3) картинка находится на удаленном сервере в Интернете:

Поясняющий текст. Расположение рисунка в тексте.

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


Положение рисунка в тексте – определяет атрибут ALIGN тэга : ТОР, MIDDLE, BOTTOM, LEFT , RIGHT.

Компьютер