Как да добавите блок на сайта

Съдържание:

Как да добавите блок на сайта
Как да добавите блок на сайта

Видео: Как да добавите блок на сайта

Видео: Как да добавите блок на сайта
Видео: Создание комментариев на сайте 2024, Може
Anonim

Има два вида оформление на сайта: таблично и блоково. И докато първата е по-удобна за създаване на прости html страници, втората е идеална, ако трябва да добавите отделни елементи под формата на блокове.

Как да добавите блок на сайта
Как да добавите блок на сайта

Инструкции

Етап 1

Има две техники, които ще ви позволят сами да разработите блок дизайн: чрез вграждане на каскадни таблици със стилове в документ или чрез свързването им от външен ресурс. И двете дават един и същ резултат, така че няма съществена разлика между тях. В първия случай поставете следния код навсякъде във файла style.css:

.block1 {

}

Block1 - името на блока, можете да напишете всяко друго. Между фигурните скоби посочете параметрите в следния формат: име на атрибут> двоеточие> стойност> точка и запетая (включително поставено преди къдравата скоба). Обикновено се използват следните елементи:

- ширина - ширина (500px, 100% и т.н.);

- височина - височина (200px, 25% и т.н.);

- фон - цвят на фона (жълт, червен, # 000000);

- подложка - подплата около съдържанието вътре в блока (0px, 20%);

- margin - външни полета от блока (15px, 40%);

- граница - рамка (граница: плътна 0px черна;);

- плувка - подравняване (ляво, дясно);

- граница-радиус - закръгляване на ъглите (граница-радиус: 10px;).

Стъпка 2

При второто използване на CSS добавете стила между етикетите и:

.block1 {

}

И добавете параметрите, които искате.

Стъпка 3

Поставете блока на желаното място в сайта, като използвате командата:

Блок 1

Запазете и опреснете страницата, тя трябва да се появи. Имайте предвид, че подравняването по височина може да варира в зависимост от това колко пълно е съдържанието. Например, ако сте задали 300px, но сте написали само един ред текст, той няма да се покаже изцяло. Това може да се коригира, например, като се използва таблица с необходимите параметри, която трябва да се постави вътре в блока, т.е. между тагове и. И за да не се виждат границите, вмъкнете атрибута

Препоръчано: