Тут будут собраны коды для оформления основной части чата где размещаются сообщения.
Основная часть чата
Страница: 1
Сообщений 1 страница 11 из 11
Поделиться12018-02-22 16:07:02
- Администратор
- Откуда: Украина
- Зарегистрирован: 2017-06-18
- Приглашений: 15
- Сообщений: 65535
- Уважение: [+10/-0]
- Позитив: [+14/-0]
- Пол: Мужской
- Провел на форуме:
2 дня 21 час - Последний визит:
2019-06-09 22:18:03
Поделиться22018-02-22 16:12:23
- Администратор
- Откуда: Украина
- Зарегистрирован: 2017-06-18
- Приглашений: 15
- Сообщений: 65535
- Уважение: [+10/-0]
- Позитив: [+14/-0]
- Пол: Мужской
- Провел на форуме:
2 дня 21 час - Последний визит:
2019-06-09 22:18:03
Выделение сообщения администратора:
Код:
.chatMessage strong {
/* Выделенное сообщение Админа чата */
background-color: #ffcc00;
font-size: 14pt;
}Выделенное персональное сообщение:
Код:
.chatMessage.chatMessageToMe {
/* Фон персональных сообщений нику (при указании ника) */
background-color: #a3f7d0;
}Выделение сообщения пользователя с Vip статусом:
Код:
.chatMessage, > span {
background-color: #99cc99;
}Выделение сообщения для обычных пользователей:
Код:
.chatMessage > span {
/* Выделенное сообщение пользователя (не VIP) */
background-color: #99cc99;
font-size: 14pt;
border-radius: 10px;
}Поделиться32018-02-22 16:21:13
- Администратор
- Откуда: Украина
- Зарегистрирован: 2017-06-18
- Приглашений: 15
- Сообщений: 65535
- Уважение: [+10/-0]
- Позитив: [+14/-0]
- Пол: Мужской
- Провел на форуме:
2 дня 21 час - Последний визит:
2019-06-09 22:18:03
Выделение ника пользователя в сообщениях пунктиром:
Код:
.user(id пользователя) {
border-bottom: 2px dotted black;
font-size: small;
}Выделение ника пользователя точками и большим шрифтом:
Код:
.user(id пользователя) {
border-bottom: 2px dotted violet;
font-size: large;
font-family: Cooper Black;
}Поделиться42018-02-22 17:20:57
- Администратор
- Откуда: Украина
- Зарегистрирован: 2017-06-18
- Приглашений: 15
- Сообщений: 65535
- Уважение: [+10/-0]
- Позитив: [+14/-0]
- Пол: Мужской
- Провел на форуме:
2 дня 21 час - Последний визит:
2019-06-09 22:18:03
Код для увелечения (уменьшения) междустрочного растояния:
Код:
.chatMain .chatMessages, .chatMain .chatPrivateMessages {
line-height: 2.2em;
}Поделиться52018-02-24 15:38:56
- Администратор
- Откуда: Украина
- Зарегистрирован: 2017-06-18
- Приглашений: 15
- Сообщений: 65535
- Уважение: [+10/-0]
- Позитив: [+14/-0]
- Пол: Мужской
- Провел на форуме:
2 дня 21 час - Последний визит:
2019-06-09 22:18:03
Код иконки для отдельного пользователя перед ником в сообщениях:
Код:
.chatUserFrom.user(id пользователя)::before {
width: 16px;
height: 16px;
background-image: url("ссылка на иконку 18 на 18");
display: inline-block;
content: "";
vertical-align: middle;
margin-right: 3px;
}Код текста для отдельного пользователя перед ником в сообщениях:
Код:
.chatUserFrom.user(id пользователя)::before {
content: "ВАША НАДПИСЬ";
margin-right: 3px;
}Поделиться62018-02-24 15:55:17
- Администратор
- Откуда: Украина
- Зарегистрирован: 2017-06-18
- Приглашений: 15
- Сообщений: 65535
- Уважение: [+10/-0]
- Позитив: [+14/-0]
- Пол: Мужской
- Провел на форуме:
2 дня 21 час - Последний визит:
2019-06-09 22:18:03
Код для смены курсора:
Код:
.chat {
cursor: url("ссылка на курсор"), default;
}Код курсора при наведение на ссылку или кнопку:
Код:
a, input[type="button"], input[type="submit"] {
cursor: url(ссылка на курсор), default;
}Поделиться72018-02-26 15:53:59
- Администратор
- Откуда: Украина
- Зарегистрирован: 2017-06-18
- Приглашений: 15
- Сообщений: 65535
- Уважение: [+10/-0]
- Позитив: [+14/-0]
- Пол: Мужской
- Провел на форуме:
2 дня 21 час - Последний визит:
2019-06-09 22:18:03
Код для смены иконок меню при нажатии на ник в окне сообщений:
Код:
/*Код смены иконки меню "Анкета"*/
.chatUserMenuInfo {
background: url(ссылка на иконку 18 на 18);
}
/*Код смены иконки меню "Открыть приват"*/
.chatUserMenuPrivate {
background: url(ссылка на иконку 18 на 18);
}
/*Код смены иконки меню "Фотографии"*/
.chatUserMenuItems li:hover a {
background: url(ссылка на иконку 18 на 18);
}
/*Код смены иконки меню "Подарить"*/
.chatUserMenuGift {
background: url(ссылка на иконку 18 на 18);
}
/*Код смены иконки меню "Игнор"*/
.chatUserMenuIgnore {
background: url(ссылка на иконку 18 на 18);
}
/*Код смены иконки меню "Забанить"*/
.chatUserMenuBan {
background: url(ссылка на иконку 18 на 18);
}Поделиться82018-02-26 16:21:46
- Администратор
- Откуда: Украина
- Зарегистрирован: 2017-06-18
- Приглашений: 15
- Сообщений: 65535
- Уважение: [+10/-0]
- Позитив: [+14/-0]
- Пол: Мужской
- Провел на форуме:
2 дня 21 час - Последний визит:
2019-06-09 22:18:03
Код иконки ползунка для прокрутки страницы:
Код:
.vscrollable::-webkit-scrollbar {width:16px;} .vscrollable::-webkit-scrollbar-thumb { background: transparent url(ссылка на иконку 18 на 18) 0 100% no-repeat;} .vscrollable::-webkit-scrollbar-track, .vscrollable:hover::-webkit-scrollbar-thumb {background-color: transparent;} .chatMessages.vscrollable, .chatPrivateMessages.vscrollable {right:180px;}Поделиться92018-02-28 16:05:23
- Администратор
- Откуда: Украина
- Зарегистрирован: 2017-06-18
- Приглашений: 15
- Сообщений: 65535
- Уважение: [+10/-0]
- Позитив: [+14/-0]
- Пол: Мужской
- Провел на форуме:
2 дня 21 час - Последний визит:
2019-06-09 22:18:03
Код ленты повторяющихся картинок справа чата возле окна ников и слева по краю обводки чата:
Код:
#chatChannel_main {
background-image: url(ссылка на картинку (слева)), url(ссылка на картинку (справа));
background-position: left, right;
background-repeat: repeat-y;
}Поделиться102018-03-02 21:54:22
- Администратор
- Откуда: Украина
- Зарегистрирован: 2017-06-18
- Приглашений: 15
- Сообщений: 65535
- Уважение: [+10/-0]
- Позитив: [+14/-0]
- Пол: Мужской
- Провел на форуме:
2 дня 21 час - Последний визит:
2019-06-09 22:18:03
Код времени перед сообщением:
Код:
.chatTime {
float: left;
}Код изменения цвета и размера времени:
Код:
.chatTime {
font-size: 12pt;
color: #a80000;} Поделиться112023-01-29 16:41:55
Hello. And Bye.
Страница: 1
Быстрый ответ
Похожие темы
| Правила чата Есть идеи? | Полный свод правил чата | 2017-09-26 |
| Такой простой метод позволяет | Дизайн | 2024-04-19 |
| Как чёрный брокер Esperio маскируется | Дизайн | 2024-04-20 |