Идём дальше пункт A4 Float clearing and hidden items мы не трогаем.
Дальше идёт пункт A5 Basic page layout and borders, он отвечает за тело форума.
Пункты:
/* A5.1 */
#pun {
margin: 30px;
position: relative;
}
/* A5.2 */
.punbb {
float: left;
width: 100%;
height: auto;
}
Заменяем на:
/* A5.1 */
#pun {
margin: auto;
width : 830px;
position: relative;
padding-bottom: 100px;
}
/* A5.2 */
.punbb {
float: left;
width: 100%;
height: auto;
}
Эти пункты отвечают за ширину тела форума.
жирным - ширина форума, настраивается по желанию. Но для того, чтобы форум смотрелся на всех разришениях одинакого, необходимо знать границы размера : 800 - 1000px.
/* A5.3 */
#pun-redirect, #pun-maint {
margin: 50px 20% 12px 20%;
width: auto;
float: none;
}
отвечает за переадресацию на форуме, пока мы её трогать не будем.
Следующие что мы будем изменять будут иконки ищим пункт:
/* C2.15 */
.punbb div.icon {
border-style: solid;
border-width: 0.6em 0.6em 0.6em 0.6em;
height: 0;
line-height: 0.0;
margin-top: 0.1em;
width: 0;
}
И заменяем его на:
/* C2.15 */
.punbb div.icon {
float: right;
display: block;
width: 100px;
height: 100px;
padding-right: 50px;
}
расположение: справа/слева
ширина и высота оптимальные размеры 50 - 100рх
отступ справа, необходима регулировка
Дальше весь пункт /* D1.4 */
заменяем на:
/* D1.4 */
#pun-title h1 span {
display: none;
}
#pun-title table {
border: none;
height: 240px;
width: 900px;
background: url("КАРТИНКА") no-repeat; background-position: top center;
}
#pun-title TD.title-logo-tdl {
border: none;
width: 100%;
}
#pun-title TD.title-logo-tdr {
border: none;
padding-right: 0px;
}
#pun-title .title-logo {
color: transparent;
}
бордовое ширина и высота шапки подгоняем под картинку для шапки.
Далее в самый низ первого окна добавляем:
/* Баннер рекламы */
#pun-title table tbody tr .title-logo-tdr {position: absolute; z-index: 1; left: 415px; top:0px
}
с помощью этого мы будем двигать баннер рекламы.
Задание:
Сделать ширину форума 900рх.
Шапка 900х450рх.
Соответственно всё это нарисовать в фш и вставить.
часть с иконками уже разбирали, но я этот урок ещё не переписала.
