Часто задают вопрос, как, где, почему и т.д.
Вот мой результат оформления информации о пользователе:
1. Нажав на картинку "Администратор" блок информации у меня сворачивается, за место картинки, там было слово "Информация", я лично захотел, чтобы блок с информацией, у меня сворачивался по нажатию на картинку, как это сделать читаем
тут и
тут.
Вот мой код вставки сворачиваемой инфы:
Код:
<span><a href="#" title="Нажмите тут, чтобы увидеть информацию" onclick="obj=this.parentNode.childNodes[1].style; tmp=(obj.display!='block') ? 'block' : 'none'; obj.display=tmp; return false;"><center><img src="images/info.gif"></center></a><div class="subblock" style="display: none">
2. Текст информации у меня смещен вправо, ниже объясню как это делать.
3. Добавлены дополнительные поля, инструкция
тут
Как сделать стильный текст, сместить его вправо, поменять фон блока, читаем ниже:
1. Стили и шаблоны
2. Управления стилями
3. Редактировать в шаблоне
4. Снизу всех шаблонов, поиск шаблонов
5. Ищем -
post_field этот класс отвечает, за оформление вывода полей в информационном поле пользователя.
6. Находим -
additional.css - таблица стилей, отвечающая за
оформление инфо о пользователе в сообщениях и не только.
7. Далее находиим класс стиля
.post_field
8. Ну а там ставите уже все, на свое усмотрение.
Вот, что стоит у меня:
.post_field {
background: #fff url(images/misc/blog/gradient-black-down.png) repeat-x; -
это отображает фон рамки информации, у меня она бело-серенькая..
color: #333333; -
цвет текста (справа)
border: 1px solid silver; -
ну это собсно сама рамка, цвет серебристый.
padding: 3px 3px 3px 10px; -
отступы
margin-top: 2px; -
отступ сверху, чтобы блок не был впритык с аватаркой.
text-align:right; -
это отвечает за смещение текста вправо.
}
.post_field strong {
color:#9900CC; -
цвет текста слева (регистрация, пол, сообщений и т.д)
}
.post_field dt {
color:#9900CC;
font-weight:700;
Результат - картинка в начале сообщения.
У кого возникнут еще вопросы и кому что не понятно, спрашивайте.