مصدر الموضوع الاصلي: موسوعة كودات cssكاملة لنسخة phpbb3

اليوم سأقدم لكم موسوعة كاملة لكودات النسخة الثالثة بعد ان رأيت ان الكثير يعانون من عدم وجود كودات لهذه النسخة والخبرة ما زالت ضعيفة في هذا الاصدار


مع انني كنت افضل ان تكون جميع الكودات محجوبة لاني اعرف ان الزوار قلما ما يعطوا الموضوع حقه ولو بكلمة شكر

ولكن هديتي لكم انني لن اخفي اي كود عليكم

سنبدأ على بركة الله

كود للتعديل في رأس المنتدى

الكود:

.headerbar {
background-color: transparent;
background-image:
 url('LINK IMAGINE');
height: 170px;
background-position: top;
background-repeat:
 no-repeat;
}

تحرير خلفية
المنتدى :

الكود:

body {
background-color: #FFFFFF;
background-Image:
url('LINK IMAGINE');
background-repeat: no-repeat;
background-attachment:
 fixed;
background-position:center;
}

صورة
خلفية من داخل المنتدى :

الكود:

#wrap {
background-attachment: fixed;
background-image:
url('URL IMAGE');
background-repeat: repeat;
background-position:
top center;
}

صورة
خلفية لالقائمة (فقط في القائمة!) :

الكود:

div#page-header div.navbar {
background-image: url('URL IMAGE'
);}

ملاحظة:
URL IMAGE
ضع رابط الصورة

تحويل القائمة في قائمة حيوية (يعمل
فقط إذا كان لديك صور في القائمة) :

الكود:

ul.linklist li a img {
filter:alpha(opacity=100);
-moz-opacity:
 1.0;
opacity: 0.5;}

ul.linklist li a img:hover {
filter:alpha(opacity=100);
 
-moz-opacity: 0.85;
opacity: 1.0;
position: relative;
top:
 -2px;}

ملاحظة:

ul.linklist Li img =الصورة قبل وضع الفأرة على النص
ul.linklist
Li img: hover = الصورة مع الاحتكاك
opacity = غموض
ul.linklist
Li img: hover => top = تغييير الصور مع الضغط عى الماوس

هذا الكود لا يعمل مع اكسبلورر

تخصيص مربع
البحث :

الكود:

#search-box #keywords {
width: 95px;
background-color:
#ffffff;
}

input.search {
background-image:
url('http://2img.net/i/fa/prosilver/icon_textbox_search.gif');
background-repeat:
 no-repeat;
background-position: left 1px;
padding-left: 17px;
}

إخفاء مربع البحث :

الكود:

#search{
display:none;
}

لتخصيص رسالة على الصفحة
الرئيسية :

الكود:

.introduction {
background-image: url('URL IMAGE);
background-repeat:
 repeat;
background-position: top center;
background-color:
#ffffff;
color: #000000;}

.introduction .h3 {
background-image:
 url("URL IMAGE");
background-repeat: repeat;
background-position:
 top center;
background-color: #ffffff;
color: #000000;
padding:
 5px;
border-bottom: 0px solid #000000;
}

لإخفاء آخر زيارة كانت في الخميس يوليو 16
، 2009 -- 13:56 ، رسائل جديدة ، وظائف ، والرسائل التي لم تكن الإجابة عليها ،
اعتبرني قرأت جميع المواضيع :

الكود:

.linklist {
display:none !important;}

.right, .rightside
 {
display:none !important;}

dd.lastpost span, ul.topiclist
dd.searchby span, ul.topiclist dd.info span, ul.topiclist dd.time span,
dd.redirect span,

dd.moderation span {display:none !important;}

تحوم في الجداول :

الكود:

li.row:hover {
background: url('URL IMAGE');
background-position:
 center;
background-repeat: no-repeat;}

Customizing legend:

الكود:

ul#picture_legend {
background-position: center;
background-repeat:
 no-repeat;
background-image: url('URL IMAGE');
text-align:
center;
padding: 24px 0;}

تخصيص
رسائل الخاصة :

الكود:

ul#privmsgs-menu {ul#picture_legend{
background-position:
center;
background-repeat: no-repeat;
background-image: url('URL
IMAGE');
text-align: CENTER;
padding: 24px 0;}

خلفية
للروابط

الكود:

div#page-footer ul.linklist {
background-image: url('URL
IMAGE');
background-position: 0 100%;}

لا تنسوا وضع روابط الصور مكان
URL
IMAGE

لصورة السفلى الخلفية للموقع :

الكود:

div#page-footer {
background-image: url('URL IMAGE');
background-position:
 bottom center;
background-repeat: no-repeat;
padding: 15px;}

تخصيص الحاجيات widget
:

الكود:

.module {
background-image: url('URL IMAGE');
background-repeat:
 no-repeat;
background-position: top center;
border: 1px solid
BLACK;}

.module .h3 {
color: white;}

صورة خلفية
للرسالة :

الكود:

    .post {
    background-image: url('URL IMAGE');
   
background-repeat: repeat;
    background-position: top center;
 
 }

صورة
الخلفية للمربع الارسال :

الكود:

.ak_msgform_subject_right_td input, .ak_msgform_message_right_td
textarea, textarea{
background-image:url('URL IMAGE');
background-repeat:
 repeat;
background-position: top center;
}

لتخصيص
رمز وspoiler

:

الكود:

dl.codebox {
padding: 3px;
background-color: lightyellow;
border:
 1px solid #C9D2D8;
font-size: 1em;
}

dl.codebox dt {color:
 purple;}

.codebox dd {color: brown;}

dl.codebox code
{color: darkgrey;}

تخصيص
أزرار المنشأ المنتدى

الكود:

a.button1, input.button1, a.button2, input.button2, button.button2
 {
background-image: url('URL IMAGE');
background-repeat: repeat;
font-family:
 comic sans ms;
color: #000000;}

تغيير مكان ايقونة الصفحة الرئيسية او المنتدى :

الكود:

a.button1:hover, input.button1:hover, a.button2:hover,
input.button2:hover, button.button2:hover {
background-image:
url('URL IMAGE');
background-repeat: repeat;
}

تغيير الصورة القادمة إلى صفحة الموضوع مع عدة صفحات

الكود:

.row .pagination {
background: url('URL IMAGE') 0 50%
no-repeat;
}

تخصيص
ملف المستخدم من المعلومات :

الكود:

.postprofile {
color: #000000;
text-align: center;}

تغيير ارتباط اللون رابط اسامي أعضاء في الرسالة

:

الكود:

.postprofile a:link, .postprofile a:active, .postprofile
a:visited, .postprofile dt.author a {
color: #000000;}

تغير لون وصورة الخلفية في الرسائل :

الكود:

body.chatbox {
  background-image: url('URL IMAGE');
 
background-color: black;}

اللون الصفوف التي تظهر في رسائل
/ للكاتب ووقت الارسال :

الكود:

.chatbox_row_1 {
  padding: 4px;
  background-color:
transparent;
  }
.chatbox_row_2 {
  padding: 4px;
 
background-color: transparent;
  }

اجعل تخصيص
عنوان الموقع :

الكود:

.chatbox-title,.chatbox-title a.chat-title {
color: #FFFFFF
!important;
text-align: center;
font-size: 20px;}

تغيير
صورة خلفية عنوان المنتدى
:

الكود:

#chatbox_header {
  background-image: url('URL IMAGE');}

مضيفا زوايا مدورة إلى قسم خاص :

الكود:

.SECTION NAME span.corners-top { background-image: url('URL
IMAGE'); }
.SECTION NAME span.corners-top span { background-image:
url('URL IMAGE'); }
.SECTION NAME span.corners-bottom {
background-image: url('URL IMAGE'); }
.SECTION NAME
span.corners-bottom span { background-image: url('URL IMAGE'); }

مصدر الموضوع الاصلي: موسوعة كودات cssكاملة لنسخة phpbb3

مصدر الموضوع الاصلي: موسوعة كودات cssكاملة لنسخة phpbb3

مصدر الموضوع الاصلي: موسوعة كودات cssكاملة لنسخة phpbb3

شكرا لك

مصدر الموضوع الاصلي: موسوعة كودات cssكاملة لنسخة phpbb3

مصدر الموضوع الاصلي: موسوعة كودات cssكاملة لنسخة phpbb3

مصدر الموضوع الاصلي: موسوعة كودات cssكاملة لنسخة phpbb3

مصدر الموضوع الاصلي: موسوعة كودات cssكاملة لنسخة phpbb3

انا عاجزه عن شكر
الف شكر وتقييم الموضوع : ممتاز جدا جدا جدا
الله يرضى عليك

مصدر الموضوع الاصلي: موسوعة كودات cssكاملة لنسخة phpbb3

مشكوررررررررررررر

مصدر الموضوع الاصلي: موسوعة كودات cssكاملة لنسخة phpbb3

كود رائع جدا ومميز
شكرا لك اخي
منتظرين جديد الاكواد بكل شوق
تحياتي للجميع
بنوتهـ مصريهـ

مصدر الموضوع الاصلي: موسوعة كودات cssكاملة لنسخة phpbb3