[PHPBB3]Меняем стилизацию форума

[k1llers]

Как изменить стилизацию форума PHPBB3 ?


Часть первая. Меняем стилизацию форума.

Решил рассказать как изменить вот это:
[Ссылки могут видеть только зарегистрированные пользователи. ]

При изменениях, рекомендую создать копию CSS стиля.
Будем изменять row1, row2, cat, catdiv

Начнем.
Заходим:

Админ панель ->Стили ->Темы ->Выберите ваш стиль

Будем изменять тег cat (Категории: Ваша первая категория, fsdf и линию перед категории "форум")

Ищем:

.cat {
	height: 28px;
	margin: 0;
	padding: 0;
	border: 0;
	background-color: #C7D0D7;
	background-image: url('styles/subsilver2/theme/images/cellpic1.gif');
	text-indent: 4px;
}

Разбираем:
height - Высота блока
margin - Разрешается использовать одно, два, три или четыре значения, разделяя их между собой пробелом. Эффект зависит от количества значений и приведен в табл.

Доп. к margin:

Число значений| Результат
1| Отступы будут установлены одновременно от каждого края элемента.
2| Первое значение устанавливает отступ от верхнего и нижнего края, второе — от левого и правого.
3| Первое значение задает отступ от верхнего края, второе — одновременно от левого и правого края, а третье — от нижнего края.
4| Поочередно устанавливается отступ от верхнего, правого, нижнего и левого края.

padding - Устанавливает значение полей вокруг содержимого элемента. Полем называется расстояние от внутреннего края рамки элемента до воображаемого прямоугольника, ограничивающего его содержимое

Доп. к padding:

Число значений| Результат
1| Поля будут установлены одновременно от каждого края элемента.
2| Первое значение устанавливает поля от верхнего и нижнего края, второе — от левого и правого.
3| Первое значение задает поле от верхнего края, второе — одновременно от левого и правого края, а третье — от нижнего края.
4| Поочередно устанавливается поля от верхнего, правого, нижнего и левого края.

border - позволяет одновременно установить толщину, стиль и цвет границы вокруг элемента
background-color - цвет фона
background-image - фоновая картинка
text-indent - Устанавливает величину отступа первой строки блока текста

Теперь разбираем row1

Будем изменять тег row1 (Форум: ваш первый форум и значок форума)

Ищем

.row1 {
	background-color: #ECECEC;
	padding: 4px;
}

Разбор можно увидеть в теге cat

Теперь разбираем row2

Будем изменять тег row2 (Число тем, сообщений и последнее сообщение)

Ищем

.row2 {
	background-color: #DCE1E5;
	padding: 4px;
}

Разбор можно увидеть в теге cat

Теперь разбираем catdiv

Будем изменять тег catdiv (Это второй столбец от cat)
Ищем

.catdiv {
	height: 28px;
	margin: 0;
	padding: 0;
	border: 0;
	background: white url('styles/subsilver2/theme/images/cellpic2.jpg') repeat-y scroll top left;
}

background - в него входит цвет фона, фоновая картинка и т.д.
Разбор можно увидеть в теге cat

Урок предназначен для новичков, строго не судить.

Автор CTAJIb(K1llers)