Еми сложно е за обясняване.
Трябва да знаеш HTML и CSS за да го сглобиш. Ще се опитам да ти обясня, но едва ли ще разбереш.
Значи отваряш си фотошопа и почваш да си режеш дизайна, като го правиш на отделни части(header, menu line и останалите блокчета). И после всяка част я слагаш в един div като я визуализираш чрез CSS. В CSS и задаваш размери и къде да се позиционира. За тази цел най-лесно се прави първо един общ div, който да е позициониран посредата това става и така
Код:
*{
margin: 0;
padding:0;
}
правиш си един клас за главния div с размери за сайта. Стига ти само width да зададеш за да може надолу сам да се оразмерява според съдържанието. Демек това имам предвид
Код:
.body{
width: XXpx; #задаваш пиксели според това колко искаш да ти е широк сайта
margin: auto; #това го оставяш така ако искаш да ти е посредата на страницата
}
След това... правиш си един клас за хедъра
Код:
.header{
background: transparent url("пътя-до-картинката") no-repeat;
margin: XXpx auto;
width: XXpx;
height: XXpx;
}
така сега да обясня. Там където е margin: XXpx auto; тука на XX задаваш някви пиксели според това колко искаш да е отдалечен от върха т.е. да не е залепен за горе, а това auto е за да се позиционира. Ако искаш да ти е залепен за горе както е WT му задаваш 0px auto; .
На width: XXpx задаваш реалните размери които си одрязал в фотошоп, за да може да ти се визуализира целия. На haight: XXpx; пак така.
След това създаваш един клас за менюто като него го float
Код:
.menu{
width: XXpx;
float: left;
padding: XXpx;
}
на width: XXpx; задаваш реалните размери които си изрязал във фотошопа. float: left; ти е за да се залепи за header-а и padding: XXpx; задаваш вътре в лентата на колко пиксела да са навътре линковете.
За останалото ще ти обясня ако разбереш и това.
