Универсальный bb-код CSS

Ночная странница

Пользователь
Регистрация
30.01.12
Сообщения
1.751
Реакции
965
Баллы
28
Возраст
47
Вы уже наверняка знаете, что HTML во всех разделах и категориях лучше отключить.
Не знаете? Отключайте! В целях безопасности.
"А как же мне тогда оформлять сообщения красиво? С прибамбасами, которые могут дать только HTML и CSS?"

А вот об этом я вам сейчас и расскажу.
Не претендую на оригинальность, наверняка до этого кто-то уже раньше меня додумался, но честно говорю - нигде не подсматривала, просто вдруг понадобился bb-код, который бы на разных стилях моего форума смотрелся бы по-разному.

"Это как?"

А вот так: есть у меня на форуме два стиля, допустим. Один черный, а другой белый, и пользователи могут между ними выбирать... Так вот если я воспользуюсь на черном стиле bb-кодом цвета и выберу белый цвет букв, то на белом стиле эти буквы станут нечитаемыми, правда?

"А как же быть?"

Рассказываю.

Универсальный bb-код для админов​

Заголовок: Стилевое оформление
Название BB кода: css
Замена:
Код:
<div class="{option}">{param}</div>
Пример: [st="page"]Текст тут[/st]
Описание: bb-код, позволяющий задать особое оформление текста сообщения, индивидуально для каждого стиля форума
Использовать опцию: да
Удалить BB код, если отсутствует текст: да
Выключить BB коды внутри этого BB кода: нет
Выключить смайлы внутри этого BB кода: нет
Выключить перенос строк внутри этого BB кода: нет
Выключить автоматическую расстановку ссылок внутри этого BB кода: нет

Всё просто, не правда ли? Те, кто умеют пользоваться каскадными таблицами стилей, уже поняли и оценили, да?

Для тех, кто не понял ничего из текста замены, объясняю: в окошко опции вставляется название любого класса, а в таблицах стилей ("Все опции стиля - дополнительные определения CSS") прописываются свойства этого класса. Индивидуально для каждого стиля, в этом и прелесть!
Возможности? Поистине безграничны.
Примеры? Сейчас покажу.

Сначала покажу, как выглядело это сообщение изначально на дефолтном стиле:



Затем я полностью взяла сообщение в теги css, в опции указала "exp" - название класса (можно как уже существующего, так и нового) и пошла в админку - задавать свойства стиля.

Что мы можем сделать?
Добавить к сообщению рамку (в админке, в стилях, а не в сообщении!):

Код:
.exp {
border: 3px solid #435B8A;
padding: 20px;
}



Сменить цвет фона сообщения:

Код:
.exp {
background: #E4C684;
}



Заменить фоновое изображение, стиль и цвет текста (не меняя самого сообщения!):

Код:
.exp {
background: #FFFFFF url(ссылка) repeat;
}
.exp b {
color: #CCFFCC;
font-weight: lighter;
}



Ещё мы можем указывать отступы текста от края, градиенты и тени... много чего... Учебник CSS вам в помощь. Само сообщение я не трогала, только выровняла по центру заголовок.

Впечатляет?
При этом на другом стиле, там где свойства класса не прописаны, сообщение выглядит точно так, как все остальные.

Почему я написала, что это bb-код для админов?
Да потому что только они могут изменять CSS форума.

Удачи!
Если будут какие-нибудь интересные стилевые находки - делитесь :)
 

fenixon

Пользователь
Регистрация
19.09.13
Сообщения
57
Реакции
1
Баллы
3
Вот это действительно круто! Огромное спасибо! Пригодится!
 

Статистика форума

Темы
200.632
Сообщения
380.533
Пользователи
327.887
Новый пользователь
Jlij00
Сверху Снизу