Складаємо робота презентация

id=“name“ Вивчаємо id

Слайд 1Складаємо робота
https://codeclubprojects.org


Слайд 2
id=“name“




Вивчаємо id


Слайд 3Застосування
HTML


CSS
#face {
position: absolute;


top: 200px;
left: 100px;
}

Слайд 4Стилі CSS
position: absolute | fixed | relative | static | inherit

position:

absolute | fixed | relative


left
top
right 
bottom 



Слайд 6Завдання проекту


Слайд 71. Додати очі до обличчя робота
Використовуємо готові теги , додаючи обраним

елементам певні стилі CSS для id

#eyes2 {
width: 200px;
position: absolute;
top: 170px;
left: 100px;
}


Слайд 82. Додаємо інші частини обличчя
#mouth1
#nose2
#ears1
#antenna
…………

Для кожного з елементів не забуваємо

коригувати
width
top
left


Слайд 9Додаткове завдання
Намалюємо з допомогою блоків
тіло робота, руки та ноги


Слайд 101. Знаходимо, що є спільного у всіх блоках та записуємо

спільні стилі CSS для тегу div

2. Шукаємо, що є спільного у блоках, які зображують руки / ноги, створюємо класи для рук / ніг та записуємо спільні стилі CSS для цих класів

3. Решту, що є унікальним для кожного окремого блоку редагуємо з допомогою ідентифікаторів

Обратная связь

Если не удалось найти и скачать презентацию, Вы можете заказать его на нашем сайте. Мы постараемся найти нужный Вам материал и отправим по электронной почте. Не стесняйтесь обращаться к нам, если у вас возникли вопросы или пожелания:

Email: Нажмите что бы посмотреть 

Что такое ThePresentation.ru?

Это сайт презентаций, докладов, проектов, шаблонов в формате PowerPoint. Мы помогаем школьникам, студентам, учителям, преподавателям хранить и обмениваться учебными материалами с другими пользователями.


Для правообладателей

Яндекс.Метрика