Презентация Блоки в HTML онлайн
На нашем сайте вы можете скачать и просмотреть онлайн доклад-презентацию на тему Блоки в HTML абсолютно бесплатно. Урок-презентация на эту тему содержит всего 26 слайдов. Все материалы созданы в программе PowerPoint и имеют формат ppt или же pptx. Материалы и темы для презентаций взяты из открытых источников и загружены их авторами, за качество и достоверность информации в них администрация сайта не отвечает, все права принадлежат их создателям. Если вы нашли то, что искали, отблагодарите авторов - поделитесь ссылкой в социальных сетях, а наш сайт добавьте в закладки.
Оцените презентацию от 1 до 5 баллов!
- Тип файла:ppt / pptx (powerpoint)
- Всего слайдов:26 слайдов
- Для класса:1,2,3,4,5,6,7,8,9,10,11
- Размер файла:12.03 MB
- Просмотров:90
- Скачиваний:0
- Автор:неизвестен
Слайды и текст к этой презентации:
№1 слайд
Содержание слайда:
№2 слайд
Содержание слайда:
№3 слайд
Содержание слайда: Блок - це звичайна прямокутна область, володіє рядом властивостей, таких як: рамка, поля і відступи.
Блок - це звичайна прямокутна область, володіє рядом властивостей, таких як: рамка, поля і відступи.
№4 слайд
Содержание слайда: Content
Вмістом блоку(content) може бути що завгодно - частина тексту, картинка, список, форма для заповнення, меню навігації і т.д.
№5 слайд
Содержание слайда: Border
Рамка (border) - це контур, для якого можна задати такі характеристики як товщина, колір і тип (пунктирна, суцільна, точкова).
№6 слайд
Содержание слайда: Поля (padding)
Поля (padding) - відділяють вміст блоку від його рамки, щоб текст, наприклад, не був "упритул" до стінок блоку.
№7 слайд
Содержание слайда: Відступи (margin)
Відступи (margin) - це порожній простір між різними блоками, що дозволяє на заданій відстані розташувати два блоки відносно один одного.
№8 слайд
Содержание слайда:
№9 слайд
Содержание слайда:
№10 слайд
Содержание слайда: Блоки, як і таблиці - це елементи, що завжди розташовуються на сторінці вертикально.
Блоки, як і таблиці - це елементи, що завжди розташовуються на сторінці вертикально.
Тобто, якщо в коді сторінки записані підряд два блоки, то відобразяться вони в браузері один під іншим.
Якщо нам потрібно розташувати кілька блоків горизонтально, то в їх властивостях задається такий параметр як "обтікання" (float).
№11 слайд
Содержание слайда: Практика
№12 слайд
Содержание слайда: Практика
№13 слайд
Содержание слайда: margin: 0 auto;
overflow: 0 auto;
margin: 0 auto 0 auto;
margin: верх право низ ліво;
auto - вказує, що розмір відступів буде автоматично розрахований браузером
№14 слайд
Содержание слайда: Практика
<div id="second_blok">
<h1>Homework</h1>
</div>
<div id="third_blok">
<img src="https://s1-goods.ozstatic.by.jpg"/>
<p>Домашняя работа</p>
</div>
<div id="fourth_blok">
<p>Текст по центру</p>
<p>Текст справа</p>
</div>
№15 слайд
Содержание слайда: Практика
<div id="second_blok">
<h1>Homework</h1>
</div>
<div id="third_blok">
<img src="https://s1-goods.ozstatic.by.jpg"/>
<p>Домашняя работа</p>
</div>
<div id="fourth_blok">
<p>Текст по центру</p>
<p>Текст справа</p>
</div>
№16 слайд
Содержание слайда: Практика
<div id="navbar">
<center>
<a href="index1.html">Головна</a>
<a href="index2.html">Новини</a>
<a href="index3.html">Контакти</a>
</center>
</div>
№17 слайд
Содержание слайда:
№18 слайд
Содержание слайда: display: block;
Блоки прилягають один до одного впритул,
якщо у них немає margin
№19 слайд
Содержание слайда: display: inline;
№20 слайд
Содержание слайда: display: inline-block;
Це значення display використовують, щоб відобразити в один рядок блокові елементи, в тому числі різних розмірів.
№21 слайд
Содержание слайда: vertical-align
Властивість vertical-align дозволяє вирівняти такі елементи всередині зовнішнього блоку
№22 слайд
Содержание слайда:
№23 слайд
Содержание слайда: Padding: 5px; /* Поля навколо тексту */
№24 слайд
Содержание слайда: ДЗ - просто
№25 слайд
Содержание слайда: ДЗ - складно
№26 слайд
Содержание слайда: Література:
http://fcit.tneu.edu.ua/navchannja/pidhotovka-do-pratsevlashtuvannia/53-web-rozrobka/html-css/554-blochna-verstka
http://htmlbook.ru/css/margin
http://htmlbook.ru/css/margin-bottom
http://htmlbook.ru/css/margin-left
http://htmlbook.ru/css/margin-right
http://htmlbook.ru/css/padding
http://ru.learnlayout.com/display.html
http://htmlbook.ru/css/display
https://learn.javascript.ru/display
Скачать все slide презентации Блоки в HTML одним архивом:
