58143

Создание Web-страниц. Форматирование текста

Конспект урока

Педагогика и дидактика

Можно перечислять несколько шрифтов через запятую так как не всегда выбранный Вами шрифт есть у пользователя просматривающего Вашу страницу. Стихотворение FONT Размер шрифта задается атрибутом size...

Русский

2014-04-22

33.5 KB

0 чел.

Урок 2. Создание Web-страниц.

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

Чтобы разбить текст на абзацы, всего-навсего надо поставить перед каждым абзацем тег <p>. Этот тег может не иметь закрывающей части.

Чтобы выделить отдельные слова, нужно заключить в контейнер с тегами, каждый их которых отвечает за один параметр.

Например,

<B> - жирный текст;

<I> - наклонный текст;

Существуют специальные теги для заголовков:  <H1>….. <H6>, самый крупный - <H1>, самый мелкий <H6>.

Не забывайте закрывать теги!!!

Контейнеры можно вставлять один в другой. Однако, следует внимательно следить за правильностью написания вложенных тегов.

Так, например:

неправильно: <B><I>ляляля</B></I>

правильно: <B><I>ляляля</I></B>

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

 Атрибут выравнивания <align>

<align=center> - по центру

<align= right> - по правому краю

<align=left> - по левому краю.

1. Откройте свою страницу в режиме редактирования (через Блокнот).

Внесем изменения:

<html>

  <head>

     <title>моя первая страница</title></head>

       <body>

       <H4 align=center>Я схожу с ума</H4>

                <IMG src="6.jpg">

       ураааааааааааааааааааааааааааааааааааааааааааааааааааааа

       </body>

 </html>

2. Просмотрите результат.

3. Добавим ещё:

<html>

  <head>

     <title>моя первая страница</title></head>

       <body>

       <H4 align=center>Я схожу с ума</H4>

       <P align=right><B>какая досада</B>

       <P>    <IMG src="6.jpg">

       <P align=center><I><B>урааааааааааааааааааааааааааааа</B></I>

       </body>

  </html>

Рассмотрим еще несколько тегов.

<BR> - перевод строки (непарный тег)

<U> тег подчеркивания </U>

<STRIKE>  тег зачеркивания  </STRIKE>

<BIG> большой текст </BIG>

<SMALL> маленький текст </SMALL>

<ADDRESS>  сведения об авторе или авторские права </ADDRESS>

  1.  Добавим на нашу страницу стихотворение Ирины Леонардовой

<BP>

<P align=left>

Это не сложно <BR>

Это не важно <BR>

Просто отважно <BR>

В небо шагнуть <BR>

<P align=center>

И осторожно, <BR>

Там, где вожможно <BR>

Тёмного облака <BR>

Край отогнуть <BR>

<P align=right>

Стёртые лица, <BR>

Забытые профили <BR>

И многоточий упрямая нить. <BR>

Свет разливается <BR>

И проявляется <BR>

То, что уже никогда не забыть. <BR>

<ADDRESS> Ирина Леонардова </ADDRESS>

       

Шрифты

Все атрибуты шрифта определяет тег <FONT> …..</FONT>

С его помощью можно указать размер, тип, цвет шрифта.

По умолчанию браузеры используют шрифт Times Roman, при желании его можно заменить на любой из известных (Verdana, Arial, Impact, Comic Sans MS,    Times  New Roman).

Например 

5. Добавьте на страничку в качестве заголовка для стихотворения

<FONT FACE=”Verdana”> Стихотворение</FONT> <BR>

<BIG><B><FONT FACE=”ARIAL”> Стихотворение</FONT></BP></BIG> <BR>

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

<FONT FACE=”Verdana, Arial”> Стихотворение</FONT>

Размер шрифта задается атрибутом size

<FONT size=10>Стихотворение</FONT> <BR>

Размер букв задается в пунктах. То есть, он может быть 1 пункт, 2 пункта, 3 пункта и так до 7 пунктов.

Цвет текста изменить так же просто, с помощью атрибута color.

<FONT color=”red”>Стихотворение</FONT> <BR>

<FONT color=#800000>Стихотворение</FONT> <BR>

AQUA  -    #00FFFF

MAROON -  #800000

YELLOW   -  #FFFF00

Задание 2. Не забудьте про задание 1. Ваша личная страница уже должна содержать фотографию, немного текста (причем отформатированного).   


 

А также другие работы, которые могут Вас заинтересовать

14398. Градуировка Вольтметра и Амперметра 3.33 MB
  Лабораторная работа №7 Тема: Градуировка Вольтметра и Амперметра. Приборы и материалы: элемент питания. элемент питания Вестона источник э.д.с. в 4 вольта гальванометр вольтметр четыре магазина резисторов соединительные провода. Ход работы: Граду
14399. Основные измерения с электронным осциллографом 342.5 KB
  Отчет по работе №130 Основные измерения с электронным осциллографом Цель работы: ознакомится с устройством осциллографа и выполнить различные измерения с его помощью. Приборы: осциллограф типа С15 вольтметр потенциометр проволочный реостат магазин сопроти
14400. Исследование магнитоэлектрического зеркального гальванометра 312.5 KB
  Отчет по работе №138 Исследование магнитоэлектрического зеркального гальванометра Цель работы: определить внутреннее сопротивление гальванометра среднюю чувствительность изучить зависимость периода колебаний логарифмического декремента затухания и време...
14401. Изучить принцип работы форвакуумного насоса 187.5 KB
  Лабораторная работа № 9 Цель работы: Изучить принцип работы форвакуумного насоса определить скорость откачки зависимость давления от времени откачки определить объем системы. Приборы и материалы: Форвакуумный насос масляный манометр термопарный вакуумметр. ...
14402. Экономическое поведение (действие) 19.11 KB
  Экономическое поведение действие поведение людей добровольно или вынужденно руководствующихся рыночными целями законами и ограничениями. Таково широкое определение экономического поведения. Более узкая трактовка предполагает сознательное стремление к выгоде пр
14403. Современные отношения молодежи, в частности группы 40.5 KB
  Современные отношения молодежи в частности группы. Общество 21 века это информационное общество оно в корне отличается от традиционного общества и далеко ушло от индустриального. Так что же изменилось за многие столетия Что нового мы можем наблюдать в совре...
14404. Экономическое отношение современной молодежи 28 KB
  Экономическое отношение современной молодежи. Я решил рассмотреть отношение современной молодежи к определенному предмету сотовые телефона и смартфоны. Почему именно сотовые телефоны потому что они есть у всех по ним можно узнать информацию о хозяине.Для старшеклассни...
14405. Экономические отношения современной молодёжи в университете 30.5 KB
  Сочинение. Тема: Экономические отношения современной молодёжи в университете. ЧТО ЗА НАЧАЛО Современная молодёжь это особая социальнаявозрастная группа людей отличающаяся возрастными рамками и своим статусом в обществе: переход от детства и юности и социальной о
14406. Экономические отношения молодежи в университете 27 KB
  Сочинение на тему: Экономические отношения молодежи в университете. XXI век тяжелое время для России. Кризисы девальвация рубля низкая заработная плата упадок экономики непомерные счета которые выставляют ЖКК. Основные затраты каждой семь это продукты питания на ко...