Інструктаж з БЖД, інструкція №2.
Створення веб-сторінок.
Практична робота
Завдання.
Створити папку "ПР_Дата_Прізвище", у якій розмістити 1 файл: index.html
Роботу відправити через:
Для виконання роботи можна користуватися програмою Notepad ++
або онлайн редактором https://liveweave.com/
Мультфільм розпочинається з народження нового Принца лісу — оленятка Бембі. Разом зі своїми першими друзями — Топотуном і його сестрами — він вчиться ходити, говорити і знайомиться з іншими мешканцями лісу. Несподіваній для нього стає зустріч з Феліно — маленькою оленихою, яка вважає спілкування з Бембі дуже цікавим і веселим. Бембі, проте, зовсім не розділяє радості Фелін. Намагаючись наздогнати настирливу знайому, Бембі зустрічається зі своїм батьком — Великим Князем лісу — найповажнішим оленем у всьому лісі.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Бембі</title>
</head>
<body>
Мультфільм розпочинається з народження нового Принца лісу — оленятка Бембі. Разом зі своїми першими друзями — Топотуном і його сестрами — він вчиться ходити, говорити і знайомиться з іншими мешканцями лісу. Несподіваній для нього стає зустріч з Феліно — маленькою оленихою, яка вважає спілкування з Бембі дуже цікавим і веселим. Бембі, проте, зовсім не розділяє радості Фелін. Намагаючись наздогнати настирливу знайому, Бембі зустрічається зі своїм батьком — Великим Князем лісу — найповажнішим оленем у всьому лісі.
</body>
</html>
Текст для виконання практичної роботи
Приклад коду
Приклад. У тексті коду веб-сторінки у файлі file1.htm вставте рухомий рядок, наприклад, такого змісту:
1) <MARQUEE BGCOLOR=”aqua” HEIGHT = 40 LOOP=5> Приватна сторінка Ваше прізвище та ім’я</ MARQUEE>.
2) Далі змініть цей рядок на такий:
<MARQUEE BGCOLOR=”aqua” HEIGHT = 50 LOOP=4 DIRECTION =”rihgt” SCROLLAMOUNT=5> <FONT FACE = “Courier” SIZE = +4 COLOR = “red”> Особиста сторінка Ваше прізвище та ім’я </FONT></MARQUEE>
Кольори в HTML
https://html-css.co.ua/html/color-in-html/ - https://uk.wikipedia.org/wiki/%D0%9A%D0%BE%D0%BB%D1%8C%D0%BE%D1%80%D0%B8_HTML
Інструктаж з БЖД, інструкція №2.
Практична робота
Створення веб-сторінок за зразком
Завдання 32а
Створити веб-сторінку за зразком.
Стародавній чарівний Ліс ніколи не пускав людей у свої таємничі глибини. Люди з сусіднього села і самі трималися від нього подалі — думали, що Ліс небезпечний, бо в ньому живуть загадкові лісові істоти. І раптом сталося диво. Мавка — душа Лісу і його Берегиня, — і Лукаш, сільський музикант, покохали одне одного.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Прізвище та ім'я</title>
<style>
body {
background: #7B68EE url(сайти/123.jpg);
color: #fff ;
align:center;
}
.block1{
float: left;
font-size:25px;
text-align: center ;
width: 70%;
padding: 10px;
padding-right: 20px;
}
.block2{
float: center;
margin-top:20px;
padding-right: 20px
}
</style>
</head>
<body>
<P align="center"><Font size="+4" COLOR=#800800 FACE="Arial"><I><b> КОМП'ЮТЕРНА ГРАФІКА </b> </I></Font>
<MARQUEE BGCOLOR=”aqua” HEIGHT = 50 LOOP=4 DIRECTION =”rihgt” SCROLLAMOUNT=5> <FONT FACE = “Courier” SIZE = +4 COLOR = “red”> <I><b>Мультфільм Мавка. Лісова
пісня</b> </I></Font> </MARQUEE>
<!--<img src="123.jpg" width="300" height="235" alt="****">-->
<div class="block1">
Стародавній чарівний Ліс ніколи не пускав людей у свої таємничі глибини. Люди з сусіднього села і самі трималися від нього подалі —
думали, що Ліс небезпечний, бо в ньому живуть загадкові лісові істоти. І раптом сталося диво. Мавка — душа Лісу і його Берегиня, — і Лукаш,
сільський музикант, покохали одне одного.
</div>
<div class="block2">
<P align="right"><img src="мавка.jpg" width="500" height="235" alt="****">
<P align="center"><Font size="+1" COLOR=#800888 FACE="Arial"><I><b> Учень: Прізвище та ім'я </b> </I></Font>
</div>
</body>
</html>
Текст для виконання практичної роботи
Зразок веб-сторінка
Завдання 32б
Створити веб-сторінку за зразком.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Прізвище та ім'я</title>
<style>
body {
background: #c7b39b url(сайти/123.jpg);
color: #fff ;
}
.block1{
float: left;
font-size:25px;
text-align: justify ;
width: 70%;
padding: 10px;
padding-right: 20px;
}
.block2{
float: center;
margin-top:20px;
padding-right: 20px
}
</style>
</head>
<body>
<P><Font size="+1" COLOR=#800800 FACE="Arial"><I><b> КОМП'ЮТЕРНА ГРАФІКА </b> </I></Font>
<MARQUEE BGCOLOR=#FFA07A HEIGHT = 50 LOOP=4 DIRECTION =”rihgt” SCROLLAMOUNT=5><Font size=6 COLOR="IndianRed" FACE="Arial"><I><b> Мультфільм Бембі</b> </I></Font> </MARQUEE>
<!--<img src="123.jpg" width="300" height="235" alt="****">-->
<div class="block1">
Мультфільм розпочинається з народження нового Принца лісу — оленятка Бембі. Разом зі своїми першими друзями — Топотуном і його сестрами — він вчиться ходити, говорити і знайомиться з іншими мешканцями лісу. Несподіваній для нього стає зустріч з Феліно — маленькою оленихою, яка вважає спілкування з Бембі дуже цікавим і веселим. Бембі, проте, зовсім не розділяє радості Фелін. Намагаючись наздогнати настирливу знайому, Бембі зустрічається зі своїм батьком — Великим Князем лісу — найповажнішим оленем у всьому лісі.
</div>
<div class="block2">
<img src="123.jpg" width="300" height="235" alt="****">
<P><Font size="+1" COLOR=#800888 FACE="Arial"><I><b> Учень: Прізвище та ім'я </b> </I></Font>
</div>
</body>
</html>
Зразок веб-сторінка
Мультфільм розпочинається з народження нового Принца лісу — оленятка Бембі. Разом зі своїми першими друзями — Топотуном і його сестрами — він вчиться ходити, говорити і знайомиться з іншими мешканцями лісу. Несподіваній для нього стає зустріч з Феліно — маленькою оленихою, яка вважає спілкування з Бембі дуже цікавим і веселим. Бембі, проте, зовсім не розділяє радості Фелін. Намагаючись наздогнати настирливу знайому, Бембі зустрічається зі своїм батьком — Великим Князем лісу — найповажнішим оленем у всьому лісі.
Текст для виконання практичної роботи
Завдання
Створити веб-сторінку за зразком.
Стародавній чарівний Ліс ніколи не пускав людей у свої таємничі глибини. Люди з сусіднього села і самі трималися від нього подалі — думали, що Ліс небезпечний, бо в ньому живуть загадкові лісові істоти. І раптом сталося диво. Мавка — душа Лісу і його Берегиня, — і Лукаш, сільський музикант, покохали одне одного.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Прізвище та ім'я</title>
<style>
body {
background: #c7b39b url(сайти/123.jpg);
color: #fff ;
}
.block1{
float: left;
font-size:25px;
text-align: center ;
width: 70%;
padding: 10px;
padding-right: 20px;
}
.block2{
float: center;
margin-top:20px;
padding-right: 20px
}
</style>
</head>
<body>
<P><Font size="+1" COLOR=#800800 FACE="Arial"><I><b> КОМП'ЮТЕРНА ГРАФІКА </b> </I></Font>
<MARQUEE><Font size=6 COLOR=#008080 FACE="Arial"><I><b>Мультфільм Мавка. Лісова пісня</b> </I></Font> </MARQUEE>
<!--<img src="123.jpg" width="300" height="235" alt="****">-->
<div class="block1">
Стародавній чарівний Ліс ніколи не пускав людей у свої таємничі глибини. Люди з сусіднього села і самі трималися від нього подалі — думали, що Ліс небезпечний, бо в ньому живуть загадкові лісові істоти. І раптом сталося диво. Мавка — душа Лісу і його Берегиня, — і Лукаш, сільський музикант, покохали одне одного.
</div>
<div class="block2">
<img src="мавка.jpg" width="500" height="235" alt="****">
<P><Font size="+1" COLOR=#800888 FACE="Arial"><I><b> Учень: Прізвище та ім'я </b> </I></Font>
</div>
</body>
</html>
Текст для виконання практичної роботи
Зразок веб-сторінка
Завдання
Створити веб-сторінку за зразком.
Про що мультфільм "Кораліна у світі кошмарів":
Головна героїня мультфільму «Кораліна у світі кошмарів» завжди хотіла знайти кращий світ, оскільки повсякденність здавалася їй нецікавою і сумною.�Її пригоди почалися з переїзду сім'ї Джонс в штат Орегон. Тут в новому будинку допитлива Кораліна знайомиться з сусідами, зустрічає бродячого чорного кота і починає бачити недвозначні знаки, які згодом приводять її до таємних дверцят, що ведуть в потойбічний світ.�Батьки дівчинки постійно зайняті, тому у неї складається враження, що її не люблять. А в паралельному всесвіті Кораліна зустрічає «інших» тата і маму з ґудзиками замість очей, які усміхнені та привітні, а навколо них звичні речі виглядають яскравішими і привабливішими.�Курсуючи між світами, Кораліна все менше віддає перевагу реальності, адже за маленькими дверцятами стільки чудес і розваг.�Але раптово казка обертається кошмаром: «інша» мама пропонує дівчинці залишитися з ними назавжди, а отримавши відмову, перетворюється в монстра і починає загрожувати реальній сім'ї героїні ...
Текст для виконання практичної роботи
Зразок веб-сторінка
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Прізвище та ім'я</title>
<style>
body {
background: #c7b39b url(сайти/123.jpg);
color: #fff ;
}
.block1{
float: left;
font-size:20px;
text-align: left ;
width: 100%;
padding: 10px;
padding-right: 20px;
}
.block2{
float: center;
margin-top:20px;
padding-right: 20px
}
</style>
</head>
<body>
<P><Font size="+1" COLOR=#800800 FACE="Arial"><I><b> КОМП'ЮТЕРНА ГРАФІКА </b> </I></Font>
<MARQUEE><Font size=6 COLOR=#008088 FACE="Arial"><I><b> мультфільм "Кораліна у світі кошмарів"</b> </I></Font> </MARQUEE>
<!--<img src="123.jpg" width="300" height="235" alt="****">-->
<div class="block1">
Про що мультфільм "Кораліна у світі кошмарів":
Головна героїня мультфільму «Кораліна у світі кошмарів» завжди хотіла знайти кращий світ, оскільки повсякденність здавалася їй нецікавою і сумною.
Її пригоди почалися з переїзду сім'ї Джонс в штат Орегон. Тут в новому будинку допитлива Кораліна знайомиться з сусідами, зустрічає бродячого чорного кота і починає бачити недвозначні знаки, які згодом приводять її до таємних дверцят, що ведуть в потойбічний світ.
Батьки дівчинки постійно зайняті, тому у неї складається враження, що її не люблять. А в паралельному всесвіті Кораліна зустрічає «інших» тата і маму з ґудзиками замість очей, які усміхнені та привітні, а навколо них звичні речі виглядають яскравішими і привабливішими.
Курсуючи між світами, Кораліна все менше віддає перевагу реальності, адже за маленькими дверцятами стільки чудес і розваг.
Але раптово казка обертається кошмаром: «інша» мама пропонує дівчинці залишитися з ними назавжди, а отримавши відмову, перетворюється в монстра і починає загрожувати реальній сім'ї героїні ...
</div>
<div class="block2">
<img src="1234.jpg" width="500" height="235" alt="****">
<P><Font size="+1" COLOR=#800888 FACE="Arial"><I><b> Учень: Прізвище та ім'я </b> </I></Font>
</div>
</body>
</html>
таблиця кольорів html