Презентация Створення Web-сторінок онлайн
На нашем сайте вы можете скачать и просмотреть онлайн доклад-презентацию на тему Створення Web-сторінок абсолютно бесплатно. Урок-презентация на эту тему содержит всего 107 слайдов. Все материалы созданы в программе PowerPoint и имеют формат ppt или же pptx. Материалы и темы для презентаций взяты из открытых источников и загружены их авторами, за качество и достоверность информации в них администрация сайта не отвечает, все права принадлежат их создателям. Если вы нашли то, что искали, отблагодарите авторов - поделитесь ссылкой в социальных сетях, а наш сайт добавьте в закладки.
Оцените презентацию от 1 до 5 баллов!
- Тип файла:ppt / pptx (powerpoint)
- Всего слайдов:107 слайдов
- Для класса:1,2,3,4,5,6,7,8,9,10,11
- Размер файла:8.91 MB
- Просмотров:66
- Скачиваний:0
- Автор:неизвестен
Слайды и текст к этой презентации:
№1 слайд
Содержание слайда: Тема:
“Створення Web-сторінок”
№2 слайд
Содержание слайда: Web-сайт – це сукупність
Web-сторінок, які об’єднані однією загальною темою
№3 слайд
Содержание слайда:
№4 слайд
Содержание слайда: Сайт-візитка
№5 слайд
Содержание слайда: Інформаційний сайт
№6 слайд
Содержание слайда: Інтернет-портал
№7 слайд
Содержание слайда: Інтернет-магазин
№8 слайд
Содержание слайда: Основи мови HTML: теги, атрибути тегів, коментарі
№9 слайд
Содержание слайда: Html-документ – це звичайний текстовий документ,
що містить спеціальні
команди для розмітки тексту (теги).
№10 слайд
Содержание слайда: ТЕГИ
№11 слайд
Содержание слайда: Тег завжди починається зі знаку «меньше» (<) і закінчується знаком «більше» (>)
Наприклад: <BR>
№12 слайд
Содержание слайда: ТЕГИ
№13 слайд
Содержание слайда: СТРУКТУРНІ ТЕГИ
№14 слайд
Содержание слайда: СТРУКТУРНІ ТЕГИ
№15 слайд
Содержание слайда: КОМЕНТАРІ
№16 слайд
Содержание слайда: ПРИКЛАД HTML-ДОКУМЕНТУ
№17 слайд
Содержание слайда: Практичне завдання
№18 слайд
Содержание слайда:
№19 слайд
Содержание слайда: Завантажуємо стандартну програму Блокнот і вводимо теги для створення
базової структури HTML сторінки
№20 слайд
Содержание слайда: Створюємо заголовок для нашої Web-сторінки, для цього необхідно ввести назву між тегами <title>«Заняття 1» </title>
№21 слайд
Содержание слайда: Зберігаємо документ:
Файл → Сохранить Как (File -> Save as)
з ім'ям: index.html
№22 слайд
Содержание слайда: Заванажуємо броузер – Internet Explorer
Відкриємо в броузері наш документ:
Файл - Открыть - кнопка Обзор
вказуємо адрес нашого документа index.html.
№23 слайд
Содержание слайда:
№24 слайд
Содержание слайда:
№25 слайд
Содержание слайда: При перегляді Web-сторінки ми бачимо, що вона вже має і’мя
№26 слайд
Содержание слайда:
№27 слайд
Содержание слайда:
№28 слайд
Содержание слайда:
№29 слайд
Содержание слайда: Змінюємо колір шрифту
<font color="#CC0000">текст</font>
№30 слайд
Содержание слайда:
№31 слайд
Содержание слайда:
№32 слайд
Содержание слайда: Створюємо колір тексту
для всього документу
№33 слайд
Содержание слайда:
№34 слайд
Содержание слайда:
№35 слайд
Содержание слайда: Створення фону
№36 слайд
Содержание слайда:
№37 слайд
Содержание слайда:
№38 слайд
Содержание слайда: Створення абзаців,
використовуємо тег
№39 слайд
Содержание слайда: Центрувати текст:
<p align="center">текст</p>
Вирівнювати по лівому краю документу:
<p align="left">текст</p>
Вирівнювати текст по правому краю документу:
<p align="right">текст</p>
По ширині документа:
<p align="justify">текст</p>
№40 слайд
Содержание слайда:
№41 слайд
Содержание слайда:
№42 слайд
Содержание слайда: Також для вирівнюювання тексту можна використовувати тег <div></div>.
Всі чотири значення атрибуту align можна вживати з <div>:
<div align="center"> текст </div>
<div align="left"> текст </div>
<div align="right"> текст </div>
<div align="justify"> текст </div>
№43 слайд
Содержание слайда:
№44 слайд
Содержание слайда:
№45 слайд
Содержание слайда: Створення заголовків
тег - <H1></H1>
№46 слайд
Содержание слайда:
№47 слайд
Содержание слайда:
№48 слайд
Содержание слайда: Встановлюємо розмір шрифта
тег – <font></font> атрибут – size
<font size="+4"> текст </font>
<font size="+3"> текст </font>
<font size="+2"> текст </font>
<font size="+1"> текст </font>
<font size="+0"> текст </font>
<font size="-1"> текст </font>
<font size="-2"> текст </font>
№49 слайд
Содержание слайда:
№50 слайд
Содержание слайда:
№51 слайд
Содержание слайда: Створення стилю для шрифта
<b> Напівжирний текст </b>
<i> Похилий текст (курсив) </i>
<u> Підкреслений текст </u>
<s> Перекреслений </s>
№52 слайд
Содержание слайда:
№53 слайд
Содержание слайда:
№54 слайд
Содержание слайда: Тип шрифту
тег – face атрибут – Arial
<font face="arial">текст</font>
№55 слайд
Содержание слайда:
№56 слайд
Содержание слайда:
№57 слайд
Содержание слайда: Вставлення малюнка
<img src=“Назва малюнка.jpg">
№58 слайд
Содержание слайда: Якщо картинка лежить в піддиректорії, то посилання на неї виглядатиме так:
<img src="Створення сайтів/1.jpg">
Якщо картинка лежить на рівень вище, а документ знаходиться в піддиректорії, то посилання на неї буде таким:
<img src="../1.jpg">
Якщо картинка лежить на іншому сайті, то шлях прописується повністю:
<img src="http://www.homepage.ru/my/1.jpg">
№59 слайд
Содержание слайда:
№60 слайд
Содержание слайда: Розташування тексту поряд з картинкою, використовують атрибут align, який відповідає за вирівнювання.
<img src=“Малюнки/1.jpg" align "left">
№61 слайд
Содержание слайда: Задаємо параметри розташування тексту біля малюнка та розмір малюнка
№62 слайд
Содержание слайда:
№63 слайд
Содержание слайда: Атрибут vspace - задає відстань між текстом і малюнком – по вертикалі
<img src=" Створення сайтів/1.jpg"vspace=“30">
Атрибут hspace- задає відстань між текстом і малюнком – по горизонталі
<img src=" Створення сайтів/1.jpg " hspace="30">
№64 слайд
Содержание слайда: р
№65 слайд
Содержание слайда:
№66 слайд
Содержание слайда: Атрибут alt - короткий опис картинки
<img src=" Створення сайтів/1.jpg
alt="Наша емблема">
№67 слайд
Содержание слайда:
№68 слайд
Содержание слайда:
№69 слайд
Содержание слайда: Картинку можна зробити фоном документа
Дана дія прописується у відкриваючому тегі body
<body text="#336699"bgcolor="#CCFFCC“
background=“Малюнки/Емблема.png">
№70 слайд
Содержание слайда:
№71 слайд
Содержание слайда: Створення таблиць
Таблиця задається тегом
<table></table>
Рядок таблиці
<tr></tr>
Стовпець (комірка) таблиці
<td></td>
№72 слайд
Содержание слайда:
№73 слайд
Содержание слайда:
№74 слайд
Содержание слайда: Колір фону таблиці задається атрибутом
bgcolor="цвет_фона“
Фон можна задати для таблиці в цілому, для ряду, для комірки.
№75 слайд
Содержание слайда:
№76 слайд
Содержание слайда:
№77 слайд
Содержание слайда: Задати фон для рядка
атрибут bgcolor ми прописуємо для тега –<tr>:
tr bgcolor="#FFCC33">
фон для всієї таблиці – атрибут bgcolor ми прописуємо для тега <table>:
<table bgcolor="#FFCC33">
№78 слайд
Содержание слайда: Задаємо висоту і ширину
таблиці
використовуємо відомі нам вже атрибути height і width
висота і ширина можуть задаватися як в пікселях, так і відсотках
№79 слайд
Содержание слайда:
№80 слайд
Содержание слайда: Вирівнювання тексту
в комірках
№81 слайд
Содержание слайда: Вертикальне вирівнювання задається наступним атрибутом - align="middle“
Вертикальне вирівнювання задається наступним атрибутом - align="middle“
Top – вгорі
Bottom – внизу
Горизонтальне вирівнювання вмісту коміркику, а valign - вертикальне, перейдемо до наступної сходинки, щоб дізнатися про інші атрибути, що полегшують наше важке життя.
№82 слайд
Содержание слайда:
№83 слайд
Содержание слайда:
№84 слайд
Содержание слайда: Створення рамки для таблиці
Рамка вводиться параметром border
<table border="5">
№85 слайд
Содержание слайда:
№86 слайд
Содержание слайда:
№87 слайд
Содержание слайда: Колір рамки
<table border=“5” bordercolor="#000000">
№88 слайд
Содержание слайда:
№89 слайд
Содержание слайда:
№90 слайд
Содержание слайда: Лінія
<Hr> і не вимагає закриваючого тега:
У лінії є багато різних параметрів:
<Hr align="right"> (center или left)
<Hr width="30%"> (ширина лінії в процентах/пікселях)
<Hr size="6"> (толщина линии)
<Hr NoShade> (отмена объемности)
<Hr color="cc0000"> (колір лінії)
№91 слайд
Содержание слайда:
№92 слайд
Содержание слайда: Створення форм
Всі елементи створення поля введення і кнопок, задаються за допомогою тегів
<input> та <form>
№93 слайд
Содержание слайда:
№94 слайд
Содержание слайда:
№95 слайд
Содержание слайда:
№96 слайд
Содержание слайда:
№97 слайд
Содержание слайда:
№98 слайд
Содержание слайда:
№99 слайд
Содержание слайда:
№100 слайд
Содержание слайда:
№101 слайд
Содержание слайда:
№102 слайд
Содержание слайда:
№103 слайд
Содержание слайда:
№104 слайд
Содержание слайда:
№105 слайд
Содержание слайда:
№106 слайд
Содержание слайда:
№107 слайд
Содержание слайда:
Скачать все slide презентации Створення Web-сторінок одним архивом:
