- Три колони каучук
- Централният каучук, фиксирани странични ленти
- Гумени наляво, надясно колона фиксирана
- Три колони напред със съдържание на каучук
В налагане подредби не забравяйте, че добавянето на някои HTML-елементи на рамката (CSS граница на собственост), външните полета (CSS марж собственост) или вътрешен отстъп (CSS уплътнение собственост) увеличава размера, и тя става по-голям, отколкото е посочено в ширина ( ширина) и височина (височина). Ако това не се вземат под внимание оформления налагането може да "вървят" или ще налагането на определени HTML елементи един върху друг. В такива ситуации е необходимо да се намали ширината и височината на елемента, за да се постигне желания размер.
Три колони каучук
Примерен HTML код и CSS: оформление оформление с три колони каучук
Описание оформление
- Всяка колона на оформлението на три колони е бил посочен процент ширина, използвайки CSS ширина.
- За колони с менюто и страничната лента се прилагат CSS поплавък имот за изкачването на страните на страницата, за да блокира съдържанието нарасна до едно и също ниво с тях.
- Към колоната със съдържанието не да плува под номер "Меню" и номер "лента". Нейни странични външни полета са определени (CSS марж), равна на ширината на страничните колони.
- За да блокирате долния не течеше около колоната, когато някои от тях ще бъде по-висока, отколкото други, имат идентификатор "долния" е създаден от прекъсване на потока (CSS ясно: и двете).
Централният каучук, фиксирани странични ленти
Примерен HTML код и CSS: оформление оформление с централен каучук и странични фиксирани колони
Описание оформление
В този три-колона оформление използва същите методи, както в предишния, освен че процентите се заменят със пиксела.
Гумени наляво, надясно колона фиксирана
Примерен HTML и CSS: оформление оформление с гумена Ляв и десен фиксирани колони
Описание оформление
- Меню и страничната лента е била зададена изкачване на правилното (CSS флоут), със съдържанието на колоната може да obtech и отидете едно ниво нагоре към тях.
- В колоната с идентификатор = "съдържание" е посочено извън дясното поле (CSS марж-вдясно) се равнява на общата ширина на меню и лента, така че тя не плува под тях.
- Поръчки при никакви обстоятелства не течеше около колоната, той беше даден CSS ясно имот: както за прекъсването на потока.
Три колони напред със съдържание на каучук
Примерен HTML код и CSS: оформление оформление с колона съдържание на гума напред
Описание оформление
- За тази с три колони оформление, съдържанието може да се примири в HTML-код, то трябваше да бъде затворено в допълнително обвивка блок с идентификатор = "cont_wrap". Той бе даден на левия изкачване (CSS поплавъка: ляво), че страничните колони могат да се движат едно ниво нагоре със съдържанието, както и изцяло ширина (CSS ширина: 100%) с неговия размер не е намалял по време на последващото изкачване.
- За съдържание на графа не се потопите под странични ленти, в ИД = "съдържание" са монтирани странични външни полета (CSS маржин), равна на ширината на менюто на страничната лента.
- За съраунд високоговорители взеха своето място, те са били дадени отрицателно лявото поле с качествата на CSS марж-наляво. меню, в което тя е равна на 100%, а в страничната лента - ширината на себе си.
- В долната част на страницата е създадена прекъсване на потока (CSS ясно), така че да е в колоните.
- Как да направите уеб сайт
Самият безплатно - Уроци по HTML
за начинаещи - CSS начинаещи
за начинаещи - Позоваването
HTML и CSS - примери
HTML и CSS - препратки
Полезни сайтове за уебмастъри - инструменти
Програми за създаване на сайтове
Свързани статии