Як на сайті додати блок.

Існує два типи верстки сайтів: таблична і блокова. І якщо перша більш зручна для створення простих html-сторінок, друга ідеально підходить в тому випадку, якщо необхідно додати окремі елементи у вигляді блоків.
Інструкція
1
Є два прийоми, які дозволять вам самостійно розробити дизайн блоку: з впровадженням каскадних таблиць стилів в документ або з підключенням їх із зовнішнього ресурсу. І той, і інший дає один і той же результат, тому принципової різниці між ними немає. У першому випадку вставте в будь-яке місце файлу style.css наступний код: .block1 {} Block1 - назва блоку, можна написати будь-яке інше. Між фігурними дужками задайте параметри у форматі: найменування атрибута> двокрапка> значення> крапка з комою (в т.ч. ставиться перед фігурною дужкою). Зазвичай використовуються такі елементи: - width - ширина (500px, 100% та ін.); - Height - висота (200px, 25% та ін.); - Background - колір фону (Yellow, Red, # 000000); - padding - відступи навколо вмісту всередині блоку (0px, 20%); - margin - зовнішні відступи від блоку (15px, 40%); - border - рамка (border: solid 0px black;); - float - вирівнювання (left, right); - border-radius - обрізка кутів (border-radius: 10px;).
2
У другому варіанті використання CSS, пропишіть стиль між тегами і : І додайте потрібні параметри.
3
Вставте блок в потрібне місце на сайті за допомогою команди:
Блок 1Сохраніте і обновіть сторінку, він повинен з'явитися. Майте на увазі, що вирівнювання по висоті може залежати від ступеня наповненості вмістом. Наприклад, якщо ви задали 300px, а прописали всього один рядок тексту, він буде відображатися не повністю. Виправити це можна, наприклад, за допомогою таблиці з потрібними параметрами, яку слід помістити всередину блоку, тобто між тегами
і. А щоб кордони не було видно, вставте атрибут border="0" .
Корисна порада
Значення параметрів padding, margin, border-radius можуть бути задані різні для кожної сторони блоку. Для цього необхідно прописати їх через крапку з комою: - одне значення задає рівний відступ від усіх сторін (margin: 5px;); - якщо значення два, перший з них відповідає за верхній і нижній край, друге - за правий і лівий (padding: 10px; 20%;); - три значення - перше регулює верх, друге - праву і ліву сторону, третє - низ (margin: 5px; 15px; 20px;); - чотири значення застосовуються черзі до верхнього, правого, нижнього і лівого краю блоку (border-radius: 10px 100px 60px 30px;).