Наприклад, не потрібно зловживати яскравими кольорами: жовтим, червоним, салатовим і т.д.
Наприклад, не потрібно зловживати яскравими кольорами: жовтим, червоним, салатовим і т.д.
-
Пошкодуйте очі відвідувачів сайту – адже яскраві кольори важко сприймаються. Тим більше текс на такому фоні просто не можливо буде читати.
+
Пошкодуйте очі відвідувачів [[Структура веб-сайтів, різновиди веб-сайтів|сайту]] – адже яскраві кольори важко сприймаються. Тим більше текс на такому фоні просто не можливо буде читати.
<br>
<br>
-
===Картинка як фон===
+
+
=== Картинка як фон ===
Окрім кольору, фоном також може служити і картинка або який-небудь візерунок.<br>
Окрім кольору, фоном також може служити і картинка або який-небудь візерунок.<br>
Строка 77:
Строка 81:
Атрибут Background вказує шлях, де лежить картинка для фону.
Атрибут Background вказує шлях, де лежить картинка для фону.
-
У цьому прикладі він указує на те, що картинка лежить у тій же папці, що і наший веб-документ.
+
У цьому прикладі він указує на те, що картинка лежить у тій же [[Папки (каталоги)|папці]], що і наший веб-документ.
Наприклад, <''body background="image1.jpg" ''>
Наприклад, <''body background="image1.jpg" ''>
Строка 95:
Строка 99:
{{#ev:youtube|eUsuuxo3nYo}}<br>
{{#ev:youtube|eUsuuxo3nYo}}<br>
+
<br>
-
==Самоконтроль==
+
== Самоконтроль ==
''1. Яка команда дозволяє встановити фоновий колір документа? ''<br>
''1. Яка команда дозволяє встановити фоновий колір документа? ''<br>
Строка 102:
Строка 107:
''2. Що потрібно зробити для того, щоб поставити на фон картинку? ''<br>
''2. Що потрібно зробити для того, щоб поставити на фон картинку? ''<br>
-
''3. Перелічить основні правила при розміщенні фонової картинки на веб-сторінку. ''
+
''3. Перелічить основні правила при розміщенні фонової картинки на [[Основные теги. Каркас веб-страницы. Полные уроки|веб-сторінку]]'' .
<br>
<br>
-
==Список використаної літератури==
+
== Список використаної літератури ==
-
''1. Урок на тему: «Вибираємо фон для веб-сторінки», Соломка А. І., м. Воронеж. ''
+
''1. Урок на тему: «Вибираємо фон для веб-сторінки», Соломка А. І., м. Воронеж. ''
-
''2. Агулар Р. HTML и CSS. Основа любого сайта. - Эксмо, 2010. ''
+
''2. Агулар Р. HTML и CSS. Основа любого сайта. - Эксмо, 2010. ''
-
''3. Квинт И. HTML и XHTML. Языки разметки web-страниц. - Питер, 2010. ''
+
''3. Квинт И. HTML и XHTML. Языки разметки web-страниц. - Питер, 2010. ''
''4. Богомолова О.Б. Web-конструирование на HTML. - БИНОМ. Лаборатория знаний, 2008.''
''4. Богомолова О.Б. Web-конструирование на HTML. - БИНОМ. Лаборатория знаний, 2008.''
-
''5. Глинський Я., Ряжська В. Інтернет. Мережі, HTML і телекомунікації. Самоучитель. - Деол, 2007. ''
+
''5. Глинський Я., Ряжська В. Інтернет. Мережі, HTML і телекомунікації. Самоучитель. - Деол, 2007. ''
<br>
<br>
Строка 122:
Строка 127:
----
----
+
<br> ''Скомпоновано та надіслано викладачем Київського національного [http://xvatit.com/vuzi/ університету] імені Тараса Шевченка Соловйовим М. С.''
-
''Скомпоновано та надіслано викладачем Київського національного університету імені Тараса Шевченка Соловйовим М. С.''
+
<br>
-
+
----
----
+
<br> '''Над уроком працювали'''
-
'''Над уроком працювали'''
+
Соломка А. І.
-
Соломка А. І.
+
Соловйов М. С.
-
+
-
Соловйов М. С.
+
+
<br>
----
----
-
+
<br> Поставить вопрос о современном образовании, выразить идею или решить назревшую проблему Вы можете на [http://xvatit.com/forum/ '''Образовательном форуме'''], где на международном уровне собирается образовательный совет свежей мысли и действия. Создав [http://xvatit.com/club/blogs/ '''блог,'''] Вы не только повысите свой статус, как компетентного преподавателя, а и сделаете весомый вклад в развитие школы будущего. [http://xvatit.com/school/guild/ '''Гильдия Лидеров Образования'''] открывает двери для специалистов высшего ранга и приглашает к сотрудничеству в направлении создания лучших в мире школ.<br>
-
Поставить вопрос о современном образовании, выразить идею или решить назревшую проблему Вы можете на [http://xvatit.com/forum/ '''Образовательном форуме'''], где на международном уровне собирается образовательный совет свежей мысли и действия. Создав [http://xvatit.com/club/blogs/ '''блог,'''] Вы не только повысите свой статус, как компетентного преподавателя, а и сделаете весомый вклад в развитие школы будущего. [http://xvatit.com/school/guild/ '''Гильдия Лидеров Образования'''] открывает двери для специалистов высшего ранга и приглашает к сотрудничеству в направлении создания лучших в мире школ.<br>
Навчити змінювати фон веб-сторінки за допомогою як кольору, так і картинки.
Тип уроку
теоретично-практичний
Хід уроку
Колір як фон
Колір фону веб-сторінки встановлюється за допомогою вже знайомого тега < BODY>.
Наприклад, якщо ми хочемо, щоб фон документа було рожевим, то код виглядає так:
< html >
< head > < title > Фон сторінки < /title >
< /head >
< Bodybgcolor="pink" >
< h2 > Зараз використовується рожевий колір для фону < h2 >
< /body >
< /html >
Документ можна розфарбувати будь-яким іншим кольором.
Якщо в елементі BODY колір не вказувати, то за замовчуванням він буде білим.
Більше кольорів для використання їх як фону можна обрати за цим посиланням: http:/ /www.artlebedev.ru/tools/colors/
Важливо знати, що поряд з тегом < BODY > одночасно можна прописувати і колір тексту, і колір фону.
Наприклад: <body text="green" bgcolor="pink">
Але є деякі правила при використанні кольору для фону.
Наприклад, не потрібно зловживати яскравими кольорами: жовтим, червоним, салатовим і т.д.
Пошкодуйте очі відвідувачів сайту – адже яскраві кольори важко сприймаються. Тим більше текс на такому фоні просто не можливо буде читати.
Картинка як фон
Окрім кольору, фоном також може служити і картинка або який-небудь візерунок.
За допомогою того ж тега < BODY > і такого атрибута як «Background», можна використовувати будь-яку картинку як фон веб-сторінки.
Атрибут Background вказує шлях, де лежить картинка для фону.
У цьому прикладі він указує на те, що картинка лежить у тій же папці, що і наший веб-документ.
Наприклад, <body background="image1.jpg" >
Існують деякі зауваження з приводу використання картинки як фону:
По-перше, потрібно ретельно вибирати картинку для фону, тому що власне картинки не годяться для фону і жахливо виглядають у розмноженому вигляді
По-друге, рекомендується для фону брати який-небудь візерунок (як у прикладі, вище)
По-третє, важливо знати, що картинка в документі «розмножується» ліворуч праворуч і зверху вниз
Самоконтроль
1. Яка команда дозволяє встановити фоновий колір документа?
2. Що потрібно зробити для того, щоб поставити на фон картинку?
3. Перелічить основні правила при розміщенні фонової картинки на веб-сторінку .
Список використаної літератури
1. Урок на тему: «Вибираємо фон для веб-сторінки», Соломка А. І., м. Воронеж.
2. Агулар Р. HTML и CSS. Основа любого сайта. - Эксмо, 2010.
3. Квинт И. HTML и XHTML. Языки разметки web-страниц. - Питер, 2010.
4. Богомолова О.Б. Web-конструирование на HTML. - БИНОМ. Лаборатория знаний, 2008.
5. Глинський Я., Ряжська В. Інтернет. Мережі, HTML і телекомунікації. Самоучитель. - Деол, 2007.
Скомпоновано та надіслано викладачем Київського національного університету імені Тараса Шевченка Соловйовим М. С.
Над уроком працювали
Соломка А. І.
Соловйов М. С.
Поставить вопрос о современном образовании, выразить идею или решить назревшую проблему Вы можете на Образовательном форуме, где на международном уровне собирается образовательный совет свежей мысли и действия. Создав блог, Вы не только повысите свой статус, как компетентного преподавателя, а и сделаете весомый вклад в развитие школы будущего. Гильдия Лидеров Образования открывает двери для специалистов высшего ранга и приглашает к сотрудничеству в направлении создания лучших в мире школ.
