Выравнивание текста. Полные уроки - История изменений

User17 в 19:09, 2 февраля 2013

2013-02-02T19:09:16Z

User16 в 11:58, 1 февраля 2013

2013-02-01T11:58:05Z

← Предыдущая		Версия 11:58, 1 февраля 2013
Строка 3:		Строка 3:
	<metakeywords>Информатика, класс, урок, на тему, 10 класс, Выравнивание текста.</metakeywords>		<metakeywords>Информатика, класс, урок, на тему, 10 класс, Выравнивание текста.</metakeywords>

		+	==Тема==
		+	*'''Выравнивание текста.'''

		+	==Цель==
		+	*Научить форматировать текстовую информацию на веб-странице.

-	~~'''Тема: Выравнивание текста.'''~~	+	==Ход урока==
-		+
-	~~'''Цель: '''Научить форматировать текстовую информацию на веб-странице.~~	+
-		+
-		+

	Для выравнивание текста на веб-странице используется уже известный тэг < p >.		Для выравнивание текста на веб-странице используется уже известный тэг < p >.

-	Но сам процесс форматирования текста происходит не этим тэгом, а с помощью дополнительных команд (''атрибутов'') этого тэга:	+	Но сам процесс форматирования текста происходит не этим тэгом, а с помощью дополнительных команд ('''атрибутов''') этого тэга:
-		+
-		+
-		+
-	~~#< p '''align="center"''' >текст< /p > - ''центрирование текста''~~	+
-	~~#< p '''align="left"''' >текст< /p > - ''выравнивание текста по левому краю''~~	+
-	~~#< p '''align="right"''' >текст< /p > - ''выравнивание текста по правому краю''~~	+
-	~~#< p '''align="justify"''' >текст< /p > - ''выравнивание текстовой информации по обеим краям ''документа (веб-страницы).~~	+


		+	#< p '''align="center"''' >текст< /p > - '''центрирование текста'''
		+	#< p '''align="left"''' >текст< /p > - '''выравнивание текста по левому краю'''
		+	#< p '''align="right"''' >текст< /p > - '''выравнивание текста по правому краю'''
		+	#< p '''align="justify"''' >текст< /p > - '''выравнивание текстовой информации по обеим краям '''документа (веб-страницы).

	В издательском деле выравнивание называется '''выключка''' – так правильней.		В издательском деле выравнивание называется '''выключка''' – так правильней.

	То есть, выключка по левому краю, по правому, по центру или по обеим сторонам.		То есть, выключка по левому краю, по правому, по центру или по обеим сторонам.
-
-

	К примеру, вот использование команды < p align='''"center"''' >:		К примеру, вот использование команды < p align='''"center"''' >:
Строка 53:		Строка 48:


		+	[[Image:Vir-1.jpg\|400px\|Здравствуйте, это моя первая страница]]

-	~~[[Image:Vir-1.jpg]]~~

-	А вот в этом примере ''выключка текста происходит по обеим сторонам'', то есть с использованием атрибута '''«justify»:'''	+	А вот в этом примере '''выключка текста происходит по обеим сторонам''', то есть с использованием атрибута '''«justify»:'''


-	[[Image:Vir-2.jpg]]	+	[[Image:Vir-2.jpg\|400px\|WEB-страница]]

-	~~<u>~~Вот еще несколько слов касательно тэга < p >:~~</u>~~	+
		+	'''Вот еще несколько слов касательно тэга < p >:'''

	- не рекомендуется вводить в документ такую конструкцию - < p >< /p >. Причиной является то, что пустые тэги < p > (то есть, без текста или других атрибутов) просто-напросто игнорируются браузерами.		- не рекомендуется вводить в документ такую конструкцию - < p >< /p >. Причиной является то, что пустые тэги < p > (то есть, без текста или других атрибутов) просто-напросто игнорируются браузерами.
Строка 68:		Строка 64:

	- после закрывающего тега < /p > происходит автоматический перенос строки.		- после закрывающего тега < /p > происходит автоматический перенос строки.
-
-

	Но если этот перенос не нужен, есть альтернативный тэг для выключек - '''< div >.'''		Но если этот перенос не нужен, есть альтернативный тэг для выключек - '''< div >.'''
-
-

	С этим тэгом можно использовать те же самые атрибуты, что и с < p >:		С этим тэгом можно использовать те же самые атрибуты, что и с < p >:
Строка 84:		Строка 76:

	< div align="justify"> текст < /div >		< div align="justify"> текст < /div >
-
-

	'''Пример выключки по центру:'''		'''Пример выключки по центру:'''


		+	[[Image:Vir-3.jpg\|400px\|WEB-страница]]

-	~~[[Image:Vir-3.jpg]]~~
-
-	Итак, завершая этот урок подведем итоги и расскажем еще ''несколько замечаний по использованию тэгов для выключки текста'':

		+	Итак, завершая этот урок подведем итоги и расскажем еще '''несколько замечаний по использованию тэгов для выключки текста''':


Строка 111:		Строка 100:
	< /p >		< /p >

-	''или''	+	'''или'''

	< p align="right" >		< p align="right" >
Строка 122:		Строка 111:

	< /p >		< /p >
-


Строка 143:		Строка 131:
	{{#ev:youtube\| SQ7cWIy63yI&feature=related}}		{{#ev:youtube\| SQ7cWIy63yI&feature=related}}

-	~~<br> '''Вопросы: '''~~

-	~~1. Какие атрибуты используются для выравнивания текста?~~	+	==Вопросы==

-	2. ~~Как можно выровнять текст по обеим сторонам~~?	+	''1. Какие атрибуты используются для выравнивания текста? ''

-	3. ~~Есть ли альтернатива тегу < p >~~?	+	''2. Как можно выровнять текст по обеим сторонам?''

-	~~4. Правила использования тэгов для выравнивания текста~~.	+	''3. Есть ли альтернатива тегу < p >?''

		+	''4. Правила использования тэгов для выравнивания текста. ''


-	~~''Список использованных источников:''~~

-	~~1. Урок на тему: «Форматирование текста», Бурлаков А. С., г. Киев.~~	+	==Список использованных источников==

-	2. ~~Квинт И. HTML и CSS~~ на ~~100 %~~. ~~- Питер~~, ~~2008~~ г.	+	''1. Урок на тему: «Форматирование текста», Бурлаков А. С., г. Киев. ''

-	3. ~~Дуванов А.А Web-конструирование~~. HTML ~~Основы информатики~~. - ~~BHV-СПб~~, ~~2005~~ г.	+	''2. Квинт И. HTML и CSS на 100 %. - Питер, 2008 г. ''

-	~~<br>~~ ''~~Отредактировано и выслано преподавателем Киевского национального университета им~~. ~~Тараса Шевченко Соловьевым М~~. С.''	+	''3. Дуванов А.А Web-конструирование. HTML Основы информатики. - BHV-СПб, 2005 г.''


	----		----

-	'''~~<u>~~Над уроком работали~~</u>~~'''	+
		+	''Отредактировано и выслано преподавателем Киевского национального университета им. Тараса Шевченко Соловьевым М. С.''
		+
		+
		+	----
		+
		+
		+	'''Над уроком работали'''

	Бурлаков А. С.		Бурлаков А. С.
Строка 176:		Строка 170:

	----		----
-

User11 в 13:53, 29 марта 2011

2011-03-29T13:53:54Z

← Предыдущая		Версия 13:53, 29 марта 2011
Строка 166:		Строка 166:


-	~~Если у вас есть исправления~~ или ~~предложения к данному уроку~~, [http://xvatit.com/~~index~~.~~php?do=feedback напишите нам~~].	+	----
		+
		+	'''<u>Над уроком работали</u>'''
		+
		+	Бурлаков А. С.
		+
		+	Соловьев М. С.
		+
		+
		+	----
		+
		+
		+
		+	Поставить вопрос о современном образовании, выразить идею или решить назревшую проблему Вы можете на [http://xvatit.com/forum/ '''Образовательном форуме'''], где на международном уровне собирается образовательный совет свежей мысли и действия. Создав [http://xvatit.com/club/blogs/ '''блог,'''] Вы не только повысите свой статус, как компетентного преподавателя, но и сделаете весомый вклад в развитие школы будущего. [http://xvatit.com/school/guild/ '''Гильдия Лидеров Образования'''] открывает двери для специалистов  высшего ранга и приглашает к сотрудничеству в направлении создания лучших в мире школ.<br>
		+

-	Если вы хотите увидеть другие корректировки и пожелания к урокам, смотрите здесь - [http://xvatit.com/forum/ Образовательный форум].

	[[Category:Информатика_10_класс]]		[[Category:Информатика_10_класс]]

User17: Новая страница: «'''Гипермаркет знаний>>Информатика>>[[Информа...»

2010-11-10T10:03:28Z

Новая страница: «'''Гипермаркет знаний>>Информатика>>[[Информа...»

Новая страница

'''[[Гипермаркет знаний - первый в мире!|Гипермаркет знаний]]>>[[Информатика]]>>[[Информатика 10 класс. Полные уроки]]>>Информатика: Выравнивание текста.'''

<metakeywords>Информатика, класс, урок, на тему, 10 класс, Выравнивание текста.</metakeywords>

'''Тема: Выравнивание текста.'''

'''Цель: '''Научить форматировать текстовую информацию на веб-странице.

Для выравнивание текста на веб-странице используется уже известный тэг < p >.

Но сам процесс форматирования текста происходит не этим тэгом, а с помощью дополнительных команд (''атрибутов'') этого тэга:

#< p '''align="center"''' >текст< /p > - ''центрирование текста''
#< p '''align="left"''' >текст< /p > - ''выравнивание текста по левому краю''
#< p '''align="right"''' >текст< /p > - ''выравнивание текста по правому краю''
#< p '''align="justify"''' >текст< /p > - ''выравнивание текстовой информации по обеим краям ''документа (веб-страницы).

В издательском деле выравнивание называется '''выключка''' – так правильней.

То есть, выключка по левому краю, по правому, по центру или по обеим сторонам.

К примеру, вот использование команды < p align='''"center"''' >:

< html >

< head >

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

< /head >

< body >

< h1 >

< p align="center">Здравствуйте, это моя первая страница.< /p >

< /h1 >

< /body >

< /html >

[[Image:Vir-1.jpg]]

А вот в этом примере ''выключка текста происходит по обеим сторонам'', то есть с использованием атрибута '''«justify»:'''

[[Image:Vir-2.jpg]]

<u>Вот еще несколько слов касательно тэга < p >:</u>

- не рекомендуется вводить в документ такую конструкцию - < p >< /p >. Причиной является то, что пустые тэги < p > (то есть, без текста или других атрибутов) просто-напросто игнорируются браузерами.

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

- после закрывающего тега < /p > происходит автоматический перенос строки.

Но если этот перенос не нужен, есть альтернативный тэг для выключек - '''< div >.'''

С этим тэгом можно использовать те же самые атрибуты, что и с < p >:

< div align="center"> текст < /div >

< div align="left"> текст < /div >

< div align="right"> текст < /div >

< div align="justify"> текст < /div >

'''Пример выключки по центру:'''

[[Image:Vir-3.jpg]]

Итак, завершая этот урок подведем итоги и расскажем еще ''несколько замечаний по использованию тэгов для выключки текста'':

'''1) '''Параграф не может содержать в себе другие параграфы (а также и тэг < div >).

То есть, такие варианты будут неверны и вводить их в документ нельзя:

< p align="right" >

< p >текст< /p >

< p >текст< /p >

< p >текст< /p >

< /p >

''или''

< p align="right" >

< div >текст< /div >

< p >текст< /p >

< div >текст< /div >

< /p >

'''2)''' Элемент < div > может содержать в себе параграфы. С помощью него можно сгруппировать их, например, по правому краю:

< div align="right" >

< p >текст первого абзаца< /p >

< p >текст второго абзаца< /p >

< p >текст третьего абзаца< /p >

< /div >

<br> {{#ev:youtube|XqF8lM2gbyc}}

{{#ev:youtube| omyeH5h1lqA&feature=related}}

{{#ev:youtube| SQ7cWIy63yI&feature=related}}

<br> '''Вопросы: '''

1. Какие атрибуты используются для выравнивания текста?

2. Как можно выровнять текст по обеим сторонам?

3. Есть ли альтернатива тегу < p >?

4. Правила использования тэгов для выравнивания текста.

''Список использованных источников:''

1. Урок на тему: «Форматирование текста», Бурлаков А. С., г. Киев.

2. Квинт И. HTML и CSS на 100 %. - Питер, 2008 г.

3. Дуванов А.А Web-конструирование. HTML Основы информатики. - BHV-СПб, 2005 г.

<br> ''Отредактировано и выслано преподавателем Киевского национального университета им. Тараса Шевченко Соловьевым М. С.''

Если у вас есть исправления или предложения к данному уроку, [http://xvatit.com/index.php?do=feedback напишите нам].

Если вы хотите увидеть другие корректировки и пожелания к урокам, смотрите здесь - [http://xvatit.com/forum/ Образовательный форум].

[[Category:Информатика_10_класс]]