Има два вида оформление на сайта: таблично и блоково. И докато първата е по-удобна за създаване на прости html страници, втората е идеална, ако трябва да добавите отделни елементи под формата на блокове.
Инструкции
Етап 1
Има две техники, които ще ви позволят сами да разработите блок дизайн: чрез вграждане на каскадни таблици със стилове в документ или чрез свързването им от външен ресурс. И двете дават един и същ резултат, така че няма съществена разлика между тях. В първия случай поставете следния код навсякъде във файла style.css:
.block1 {
}
Block1 - името на блока, можете да напишете всяко друго. Между фигурните скоби посочете параметрите в следния формат: име на атрибут> двоеточие> стойност> точка и запетая (включително поставено преди къдравата скоба). Обикновено се използват следните елементи:
- ширина - ширина (500px, 100% и т.н.);
- височина - височина (200px, 25% и т.н.);
- фон - цвят на фона (жълт, червен, # 000000);
- подложка - подплата около съдържанието вътре в блока (0px, 20%);
- margin - външни полета от блока (15px, 40%);
- граница - рамка (граница: плътна 0px черна;);
- плувка - подравняване (ляво, дясно);
- граница-радиус - закръгляване на ъглите (граница-радиус: 10px;).
Стъпка 2
При второто използване на CSS добавете стила между етикетите и:
.block1 {
}
И добавете параметрите, които искате.
Стъпка 3
Поставете блока на желаното място в сайта, като използвате командата:
Блок 1
Запазете и опреснете страницата, тя трябва да се появи. Имайте предвид, че подравняването по височина може да варира в зависимост от това колко пълно е съдържанието. Например, ако сте задали 300px, но сте написали само един ред текст, той няма да се покаже изцяло. Това може да се коригира, например, като се използва таблица с необходимите параметри, която трябва да се постави вътре в блока, т.е. между тагове и. И за да не се виждат границите, вмъкнете атрибута