Як створити блок div і як намалювати горизонтальну лінію в html
Вітаю Вас дорогі Новомосковсктелі! Сьогодні ми поговоримо про блокахdiv і про горизонтальної лінійhr.
усередині тега
створюється невидимий блок (контейнер), над якому ми можемо впливати за допомогою CSS. Без CSS даний блок ніяк не впливає на каркас сторінки.Для початку напишемо код сторінки без блоку div. Наприклад, цей:
Дивимося, як виглядає сторінка в браузері:
Тепер розіб'ємо цю сторінку на два блоки div. Один з головним меню, а інший з текстом.
Дивимося в браузері:
Як бачимо, зовнішній вигляд сторінки ніяк не змінився, в цьому і вся сила даного блоку, він є логічним блоком. Даний блок дуже важливий елемент, так як він часто використовується при верстці сторінки, і Ви зобов'язані його знати. Уже безпосередньо через CSS ми можемо поставити ширину для даного блоку, задати йому рамку, вказати щоб все абзаци всередині блоку були якогось кольору і т.д,
А тепер між цими два блоки пропишемо горизонтальну лінію, яка створюється за допомогою одинарного тега
Ось як виглядає ця лінія в браузері:
На дану лінію можемо впливати за допомогою наступних атрибутів:
Width - Задаємо ширину лінії
Size - Задаємо товщину
Align - вирівнювання лінію
Color - Задаємо колір
Давайте для прикладу зменшимо їй ширину, вирівняємо її по правому краю сторінки, задамо їй товщину в 5px і зробимо її червоного кольору.
Тепер код лінії повинен виглядати таким чином:
Дивимося на результат:
Ось, мабуть, і все про що я хотів Вам розповісти в цій статті. Тепер ви знаєте, що таке блокdiv і як він створюється. Також Ви дізналися, як створити горизонтальну лінію і як змінити її зовнішній вигляд за допомогою атрибутів.
Тоді поділіться нею з друзями та підпишіться на нові цікаві статті.