Я усердно изучаю построение WEB-страниц - это 1 абзац 

Заглавная страница
Избранные статьи
Случайная статья
Познавательные статьи
Новые добавления
Обратная связь

КАТЕГОРИИ:

Археология
Биология
Генетика
География
Информатика
История
Логика
Маркетинг
Математика
Менеджмент
Механика
Педагогика
Религия
Социология
Технологии
Физика
Философия
Финансы
Химия
Экология

ТОП 10 на сайте

Приготовление дезинфицирующих растворов различной концентрации

Техника нижней прямой подачи мяча.

Франко-прусская война (причины и последствия)

Организация работы процедурного кабинета

Смысловое и механическое запоминание, их место и роль в усвоении знаний

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

Обработка изделий медицинского назначения многократного применения

Образцы текста публицистического стиля

Четыре типа изменения баланса

Задачи с ответами для Всероссийской олимпиады по праву


Мы поможем в написании ваших работ!



ЗНАЕТЕ ЛИ ВЫ?

Влияние общества на человека

Приготовление дезинфицирующих растворов различной концентрации

Практические работы по географии для 6 класса

Организация работы процедурного кабинета

Изменения в неживой природе осенью

Уборка процедурного кабинета

Сольфеджио. Все правила по сольфеджио

Балочные системы. Определение реакций опор и моментов защемления

Я усердно изучаю построение WEB-страниц - это 1 абзац

⇐ ПредыдущаяСтр 4 из 7Следующая ⇒


</P>

</BODY>

</HTML>

Сохраните созданный документ под именем Пример1 с расширением *.htm на диске в своей папке.

Закройте программу Блокнот.

Загрузите созданную Web - страницу: двойной щелчок по имени файла Пример1.htm

или

Загрузить программу Explorer —> Файл —> Открыть -> указать имя файла Пример1.htm.

Бегущая строка

Бегущая строка в тексте документа является одним из легких способов оживить Web -страницу. Бегущие объекты всегда привлекают внимание, и пользователь обязательно прочитает написанное. Бегущая строка создаётся с помощью тегов <marquee>... </marquee> со следующими атрибутами:

· width="..." - ширина бегущей строки в пикселях или процентах от ширины экрана;

· height="..." - высота бегущей строки в пикселях или процентах. Если вы делаете бегущую строку в одну строчку, то можно высоту не указывать, она сама подбирается под размер букв;

· bgcolor="..." - определяет цвет фона бегущей строки;

· behavior="..." задает тип движения (поведение) бегущей строки и имеет следующие значения:

§ scroll - циклическая прокрутка текста из одного конца в другой;

§ slide - текст появляется с одного края и останавливается у другого;

§ alternate - текст перемещается от одного края к другому и обратно;

· direction="..." - определяет направление движения бегущей строки. Имеет следующие значения:

§ left - текст движется влево по строке;

§ right - текст движется вправо по строке;

§ up - вся строка перемещается снизу вверх;

§ down - строка движется сверху вниз;

· scrollamount="..." - шаг перемещения в строке в пикселах, на который перемещается текст за заданный интервал времени. Например: scrollamount="1";

· scrolldelay="..." - этот атрибут задаёт временной интервал между шагами бегущей строки в миллисекундах. Например: scrolldelay="100";

· loop="..." - задаёт число проходов текста бегущей строки. По умолчанию или при указании значения -1 (infinite) броузер будет прокручивать текст бесконечное число раз;

· hspace="..." - этот атрибут задает поле в пикселах справа и слева от бегущей строки. Например: hspace="10";

· vspace="..." - Этот атрибут задает отступ в пикселах выше и ниже бегущей строки. Например: hspace="0".

Ниже приведен пример кода для бегущей строки размером 50 пикселей в высоту и 250 пикселей в ширину. Определена бесконечная прокрутка текста, текст перемещается слева направо и имеет ярко-голубом фоне.

 

<marquee loop="infinite" behavior="alternate"

bgcolor="aqua" direction="right" height="50" width="250">

Страничка Светы Ивановой

</marquee>

 

Задание 2. Установка дополнительного атрибута ALIGN

для меток <Н> и <P>

 

Отредактируйте созданную ранее страницу:

- загрузите программу Блокнот;

- откройте файл Пример1.htm для редактирования.

Вставьте бегущую строку, дополнительный абзац и произведите выравнивание:

 

<HTML>

<HEAD>

<TITLE>

Институт МИПП - группа 109

</TITLE>

</HEAD>

<BODY>

<!-- Это бегущая строка -->

<marquee loop="infinite" behavior="alternate"

bgcolor="aqua" direction="left" height="30" width="550">

Страничка Светы Ивановой

</marquee>

<H1 ALIGN= center>

Прекрасно! Это моя первая Web-страница!

</Н1>

<P ALIGN= RIGHT>

Я усердно изучаю построение WEB-страниц - это 1 абзац

</P>

</BODY>

</HTML>

Сохраните изменение документа под тем же именем.

Просмотрите созданную страницу.

 

РАЗМЕТКА ВНУТРИ ТЕКСТА

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

 

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

Тег <HR> описывает, горизонтальную линию и имеет атрибуты:

<HR SIZE=4> - определяет ширину линии в пикселях;

<HR WIDTH=50%> - определяет линию в процентах от ширины экрана.

Теги <BR> и <HR> не парные.

Теги <FONT> и </FONT > устанавливают размер, цвет и начертания шрифта текста и имеют атрибуты: SIZE, COLOR, FACE.

Атрибут SIZE= - задает абсолютный размер шрифта. Предполагается, что возможны семь заранее заданных размеров шрифта (1 до 7). Эти размеры не соответствуют, каким либо размерам - чем больше значение, тем крупнее шрифт. По умолчанию используется SIZE= 3.

Атрибут COLOR= - задает цвет шрифта, который может быть задан либо ключевым словом (например, RED - красный), либо шестнадцатеричным значением в системе RGB (например, #FFOOOO - это тоже красный цвет).

Атрибут FACE = - задает тип шрифта. Значением этого атрибута должно быть название одного из шрифтов, установленных на компьютере.

Специальные символы <, >, & и " имеют в HTML особое значение, как символы форматирования. Но иногда нам необходимо использовать их в тексте по своему прямому назначению. Для их введения в текст, необходимо использовать:

&lt;

- левая скобка <

&gt;

- правая скобка >

&amp;

- &

&quot;

- "

ЗАМЕЧАНИЕ: специальные символы чувствительны к регистру: нельзя использовать &LT; вместо &lt;.

К другим парным тегам форматирования символов текста относятся следующие:

<strong> - идентификатор выделенного шрифта.

<tt> - идентификатор равноширинного шрифта (телетайпного или курьера).

<big> - задает увеличенный размер шрифта.

<small> - задает уменьшенный размер шрифта.

<center> - задает центрирование текста.

<sub> - задает нижний индекс. Пример:

x<sub>1</sub>+x<sub>2</sub>=x<sub>3</sub>

<sup> - задает верхний индекс. Пример:

 

Теорема Пифагора a<sup>2</sup>+b<sup>2</sup>=c<sup>2

 

Рассмотрим теги форматирования абзацев:

<p align=left> - выравнивание текста в абзаце по левому краю (align - атрибут выравнивания).

<p align=right> - выравнивание текста в абзаце по правому краю.

<p align=center> - выравнивание текста в абзаце по центру.

<p align=justify> - полное выравнивание по обоим краям экрана.

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

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

§ Правильно выбирайте размер отступа. Чем крупнее шрифт, тем больше отступ, и наоборот.

§ Если вы пользуетесь тегом <NOBR>, не забывайте и о теге <WBR>. Первый тег запрещает перевод строки, второй же предлагает браузеру альтернативное место перевода строки, если в этом все же возникнет необходимость.

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

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

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

 

Стили форматирования.

Различают физические и логические стили форматирования текста.

Под физическом стилем принято понимать прямое указание браузеру на модификацию текущего шрифта. Например, все, что находится между метками <B> и </B>, будет написано жирным шрифтом. Текст между метками <I> и </I> будет написан наклонным шрифтом.

Несколько особняком стоит пара меток <TT> и </TT>. Текст, размещенный между этими метками, будет написан шрифтом, имитирующим пишущую машинку, то есть имеющим фиксированную ширину символа.

Логические стили. При использовании логических стилей автор документа не может знать заранее, что увидит на экране читатель. Разные браузеры толкуют одни и те же метки логических стилей по-разному. Некоторые браузеры игнорируют некоторые метки вообще и показывают нормальный текст вместо выделенного логическим стилем. Вот самые распространенные логические стили.

<EM>... </EM>

От английского emphasis — акцент.

<STRONG>... </STRONG>

От английского strong emphasis — сильный акцент.

<CODE>... </CODE>

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

<SAMP>... </SAMP>

От английского sample — образец. Рекомендуется использовать для демонстрации образцов сообщений, выводимых на экран программами.

<KBD>... </KBD>

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

<VAR>... </VAR>

От английского variable — переменная. Рекомендуется использовать для написания имен переменных.

 

 

Задание 3. Разметка внутри абзаца

 

Отредактируйте созданную страницу

Загрузите программу Блокнот.

Откройте файл Пример1.htm для редактирования.

Вставьте дополнительный абзац - стихотворение и отделите абзац горизонтальными линиями:

 

<HTML>

<HEAD>

<TITLE>

Институт МИПП - группа 109

</TITLE>

</HEAD>

<BODY>

<marquee loop="infinite" behavior="alternate"

bgcolor="aqua" direction="left" height="30" width="550">

Страничка Светы Ивановой

</marquee>

<H1 ALIGN=CENTER>

Прекрасно! Это моя первая Web-страница!

</Н1>

<P ALIGN= RIGHT>


⇐ Предыдущая1234567Следующая ⇒

Поделиться:


Читайте также:


Где возникла философия и почему?
Относительная высота сжатой зоны бетона
Сущность проекции Гаусса-Крюгера и использование ее в геодезии
Тарифы на перевозку пассажиров


Последнее изменение этой страницы: 2017-02-22; просмотров: 224; Нарушение авторского права страницы; Мы поможем в написании вашей работы!

infopedia.su Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав. Обратная связь - 18.218.184.214 (0.026 с.)