Pentru a schimba un pic aspectul forumului urmareste acest tutorial!
Trebuie cunostinte generale CSS si HTML
La ChatBox
• Schimbaţi culoarea de fundal la posturi:
- Culoarea de fundal pentru linii impare (liniile 1, 3, 5, 7 ...)
- Cod:
-
.chatbox_row_1 {
background-color: #ecf3f7;
}
- Culoarea de fundal pentru linii pare (liniile 2, 4, 6, 8 ...)
- Cod:
-
.chatbox_row_2 {
background-color: #e1ebf2;
}
• Modificarea culorii lista membrilor online din chatbox:
- Cod:
-
.memberlist_row_1 {
background-color: #ecf3f7;
}
• Modificarea culorii titlul chatbox:
- Cod:
-
.chatbox-title,.chatbox-title a.chat-title {
color: #ffffff !important;
}
• Modificarea alinierii a titlului chatbox:
- Cod:
-
.chatbox-title {
float: left;
margin: 0;
padding: 6px 5px 0 5px;
width: 15em;
}
• Modificaţi dimensiunea fontului de mesaje din chatbox
- Cod:
-
.chatbox {
font-size: 15px;
}
Mesaje
• Schimbaţi culoarea de fundal al postului:
- Cod:
-
.post-container {
background-color: #EE0030;
}
• Modificarea culorii scrierea mesajelor, precum şi modele de mesaj:
- Cod:
-
.post-container {
color: #EE0030;
}
• Schimbaţi culoarea de fundal a unui mesaj:
- Cod:
-
.postbody {
background-color: #EE0030;
}
• Schimbarea profilurilor culoarea de fundal în posturi:
- Cod:
-
.post {
background-color: #EE0030;
}
• Modificarea aspectului de separare între două mesaje într-un subiect:
- Cod:
-
.popmenubutton-new-out a {
background-color: #EE0030;
}
• Schimbaţi culoarea de fundal a meniului (atunci când sunt deschise):
- Cod:
-
.popupmenu li {
background-color: #F73100;
}
• Modificări conturul meniul drop-down (atunci când sunt deschise):
- Cod:
-
.popupmenu {
background-color: #FFFFFF;
}
• Schimbaţi culoarea de fundal a barei care conţin link-uri "anterior Vezi topic ˇ Subiectul următor
- Cod:
-
.topic-footer {
background-color: #EE0030;
}
• Schimbaţi culoarea de fundal a barei de butoane care conţin moderator, şi permisele
- Cod:
-
.bar {
background-color: #EE0030;
}
• Schimbarea culorii textului din bara cu butoane de moderaţie şi a permiselor:
- Cod:
-
.bar {
color: #EE0030;
}
Profil
• Schimbaţi culoarea de fundal a profilului:
- Cod:
-
.box-content.profile {
background-color: #EE0030;
}
• Modificarea culorii de la bara care conţin numele de autor al unui mesaj pentru vizitatori.
- Cod:
-
#profile-advanced-details .message-header {
background: #EE0030;}
• Se determină poziţia numelui de autor, data şi ora, în acelaias bara.
- Cod:
-
#profile-advanced-details .message-date {
float: left;
}
• Se determină poziţia de link-uri "Ascunde" şi "Delete" într-un mesaj vizitator.
- Cod:
-
#profile-advanced-details .message-footer {
text-align: left;
}
• Determină mărimea din a doua coloană de profil avansate (coloana care conţine un avatar, gradul şi prieteni ...):
- Cod:
-
#profile-advanced-right {
width: 120px;
}
• Modificaţi aspectul titluri în fila Statistică al Profil avansate (subiecte, mesaje, informatii ...)
- Cod:
-
#profile-advanced-details .stats-field legend {
font-weight: bold; color: #EE0030;
}
• Modificaţi aspectul textului, în special în fila Statistici:
- Cod:
-
#profile-advanced-details .stats-field ul {
text-indent: 10px;
padding: 0;
color: #EE0030;
}
• La fel ca şi cea anterioară
- Cod:
-
#profile-advanced-details .stats-field li {
color: #EE0030;
}
Mesaje private
• Modificarea culorii fila deschise (Inbox, Sent mail, etc ..)
- Cod:
-
ul.privmsg li {
background-color: #EE0030;
color: #fff;
}
• În schimb acest cod de modificări de culoare de alte file, nedeschis:
- Cod:
-
ul.privmsg li a {
background-color: #EE0030;
}
La FAQ
• Modificări la cadrul care conţine răspunsul la o întrebare:
- Cod:
-
dl.faq dd p {
border: 1px solid #EE0030;
}
• Modificări la bara între două întrebări:
- Cod:
-
dl.faq .question {
border-bottom: 1px solid #EE0030;
}
Lista de membri
• Modificări cadru în jurul prezentarea unui profil:
- Cod:
-
.member {
background-color: #fff;
border: 1px solid #EE0030;
}
• Schimbare de fundal şi de frontieră din avatar din lista de membri:
- Cod:
-
.member-list .popmenubutton .mini-avatar {
border: 1px solid #EE0030;
background-color: #EE0030;
}
• Schimbarea culorii textului din caseta de profil (vizite recente, mesaje, diverse opţiuni de profil):
- Cod:
-
.member p {
color: #EE0030;
}
• Amendament la partea de jos a clasei membru (nu se concentreze parte de un profil de fond, ci una în spatele)
- Cod:
-
div.borderwrap .member-list {
background-color: #EE0030;
}
Căutare
• Schimbaţi culoarea de fundal:
- Cod:
-
#search_menu {
background-color: #EE0030;
border: 1px solid #ffffff;
}
• Schimbare o căutare de culoare de frontieră:
- Cod:
-
#search_menu input.post {
border: 1px solid #EE0030;
}
• Modificarea widget "Căutare" şi pagina "Căutare avansată":
- Cod:
-
.advanced-search .search-footer {
background-color: #EE0030;
border-top: 1px solid #ffffff;
}
Sondaj
• Schimbarea substanţa a sondajului, o dată votat:
- Cod:
-
.polls {
background-color: #EE0030;
}
• Schimbare opţiuni de culoare a sondajului:
- Cod:
-
.polls dl {
color: #EE0030;
}
Smileys
• Amendament la marginea cadrului conţin smileys atunci când compuneţi un mesaj
- Cod:
-
.smiley-container {
border: 1px solid;
color: #EE0030;
}
• Schimbaţi culoarea de fundal a meniului "Mai multe zambete"
- Cod:
-
.smiley-selector {
background-color: #EE0030;
}
• Modificarea culorii de contur a cutiei (care este scris HTML activat, codul BB este activat, etc.)
- Cod:
-
#smiley-box {
background-color: #EE0030;
border: 1px solid #;
}
Trimite un mesaj
• Modificarea culorii conturul caseta de text (cadrul care conţine butoanele de formatare)
- Cod:
-
.messaging-box {
background-color: #EE0030;
border: 1px solid #;
}
• Modificare marginea cutiei, astfel încât, prin extensie, în partea de jos a casetei, consultaţi Formatarea textului atunci când scrieţi un răspuns:
- Cod:
-
.messaging-box textarea {
border: 2px inset #105289;
}
Bara de navigare
• Culoare text, prin extensie este de formatare:
- Cod:
-
#submenu ul li a {
color: #EE0030;
}
• Modificări deasupra fundal cursorul peste un element din bara de navigare:
- Cod:
-
#submenu ul li a:hover {
background-color: #EE0030;
}
• Modificarea la bara de mai jos bara de navigare (conţinând "Conectat ca clienţi, etc ..)
- Cod:
-
#userlinks {
background-color: #EE0030;
border-bottom: 1px solid #cadceb;
}
• La fel de oaspeţi:
- Cod:
-
#userlinks.not-connected {
background-color: #EE0030;
border-bottom: 1px solid #cadceb;
}
• Modificarea culorii titlul în pagina de sumar:
- Cod:
-
#navstrip {
color: #EE0030;
}
Banner
• Schimbaţi culoarea de fundal în spatele banner-ul:
- Cod:
-
div#logostrip {
background-color: #EE0030;
}
Module şi portal
• Schimbare introduce conţine titlul de un widget:
- Cod:
-
.module .maintitle {
padding: 100px;
}
• Modificarea scris cu privire la titlul de widget-uri (de exemplu, formatare)
- Cod:
-
.module .maintitle h3 {
float: none;
font-size: 1em;
color: #EE0030;
}
• Schimbare widget-uri de text (dar nu, al legăturilor exclamatii):
- Cod:
-
.module .box-content {
color: #EE0030;
}
• Schimbare de natura poliţiei modulelor centrale ale portalului:
- Cod:
-
.module .postbody {
padding: 0;
color: #EE0030;
}
• Schimbarea de formatare a widget-uri subsol (de exemplu, "Comentarii: 0)
- Cod:
-
.module .postbody .post-footer {
color: #EE0030;
}
Diverse
• Modificaţi formatarea "Birthday" casuta "statistici" ...
- Cod:
-
.formsubtitle {
padding: 5px;
color: #EE0030;
}
• Modificaţi formatarea descrierea titlul de pe forum (de mai jos sau alături de banner)
- Cod:
-
div#logostrip {
min-height: 70px;
color: #EE0030;
}
• Modificaţi formatarea descrierea sub lozinca
- Cod:
-
#site-desc {
margin: 8px;
color: #EE0030;
}
• Modificaţi formatarea titlul de pe forum (de lângă sau de mai jos banner)
- Cod:
-
div#logostrip #main-title h1 {
padding-top: 0;
color: #EE0030;
}
• Extinderea caseta de intrare pentru e-mail de forma:
- Cod:
-
textarea {
width:650px;
}
Tutorial realizat de Jacky
Re-editat de ReDmAn pentru MetalZone
Sursa:
ForumGratuit
Acasa 
