Итак, ладно не будем тянуть кота за хвост, я думаю мало кому интересно, что:
Стилем или CSS (Cascading Style Sheets, каскадные таблицы стилей) называется набор параметров форматирования, который применяется к элементам документа, чтобы изменить их внешний вид.
Но я должна это написать, ибо, просто так должно быть во всяком уроке, который повествует об этом деле (:
А если на пальцах, то любой форум, без стиля css, будет выглядеть так:
Ну теперь, когда вы поняли предназначение css-файла, мы можем приступить к синтаксису.
Все стили css состоят из селекторов (классов, псевдоклассов, псевдоэлементов...) и их параметров. И записываться это все таким образом:
Селектор { свойство1: значение; свойство2: значение; }
mybb и подобные форумы, можно поделить на шесть главных селекторов, заключенных в один главный-преглавный под названием pun. А еще есть body. Этот селектор отвечает, за ВСЕ пространство, которое находиться за остальными элементами. Короче, если представить сайт как сандвич, то body будет там последним куском хлеба. 
И так, разберем все по порядку.
pun-title - отвечает за шапку сайта, где-то в его дебрях обитает и реклама, и заголовок, а чуть выше него лежит тот самый html-вверх.
pun-navlinks - менюшка, тут и говорить нечего.
pun-announcement - кто знает английский, сразу понял, что это объявление.
pun-main - самый толстый, не считая pun'а селектор. Отвечает за форум/контент
statscon - статистика.
pun-about - футер/подвал/низ форума, полный антипод pun-title. Ниже него располагается тот самый html-низ.
body - в нем обычно прописываться фон страницы (не подложки форума!)
К любому из этих селекторов мы можем указать параметры. Самих этих "правил" в css великое множество, всех их описать я не смогу, да это и не нужно. Я сама не помню всех их наизусть. Есть хороший сайт, там вы сможете найти список ВСЕХ параметров. Там же и удобная навигация, хороший поиск, вообще пользуйтесь)
Представим нам захотелось поставить повторяющее фоновое изображение, допустим фиалки:
За фон форума, как мы теперь знаем, отвечает селектор боди, пол дела сделано! Теперь идем на вышеуказанный сайт, css ---> справочник css и находим там...параметр background-image, тобишь фон-изображение. Пишем, селектор (body) + свойство (background):
body{
background-image:
}Так, не хватает значения. Нам нужно указать, какой фон мы хотим/откуда его взять. В справочнике написано, как это осуществить
background-image: url('ссылка на изображение')
Грузим фиалки на uploads и копипастим ссылку куда указано. В результате получаем:
body{
background-image: url('http://s2.uploads.ru/cbwmh.jpg');
}Хочу чтобы вы все завели свой тестовый форум и там проверили, как это работает и кинули ссылочки в эту тему. Можете взять фоновое изображение на свой вкус (:
На этом первый урок закончен. Жду ваших вопросов.
Отредактировано menestrel (2012-12-24 22:53:41)
