هل تريد التفاعل مع هذه المساهمة؟ كل ما عليك هو إنشاء حساب جديد ببضع خطوات أو تسجيل الدخول للمتابعة.


 
التسجيلالرئيسيةyoukurdأحدث الصوردخول

 

 جميع الاكواد الخاصة بمنتديات للنسخة phpbb2

اذهب الى الأسفل 
+4
saken
ممدوح السروى
رحمة
azad
8 مشترك
كاتب الموضوعرسالة
azad
مدير المنتدى
azad


عدد المساهمات : 2480
تاريخ التسجيل : 10/10/2009
العمر : 47
الموقع : http://www.absba.org/showthread.php?t=1004912

جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Empty
مُساهمةموضوع: جميع الاكواد الخاصة بمنتديات للنسخة phpbb2   جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Icon_minitimeالثلاثاء ديسمبر 22, 2009 10:32 am

أكواد CSS الخاصة بمنتديات محمودكو - هدية للجميع بمناسبة اقتراب العيد !!

تم إضافة أكواد جديدة بتاريخ 25-11-2009

بدايتها من الكود السابع

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

طريقة التركيب

خاصة فقط بالنسخة phpbb2 وربما تعمل على النسخ الاخرى

من لوحة الادارة - مظهر المنتدى - الوان - ورقة css

ثم ضع الكود ثم سجل

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

الكود الاول

المهمة : وضع خلفية لاسم العضو



الكود:
.name a{
text-decoration: none;
[b][color=darkgreen]border:1px dashed #000000[/color][/b];
background: url([b][color=blue][url=http://i44.tinypic.com/301hraq.gif]http://i44.tinypic.com/301hraq.gif[/url][/color][/b]);
}


لتغيير الخلفية يمكنك استبدال

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

ولتحكم في الحدود (للخبراء) يمكنكم التعديل على

border:1px dashed #000000

حيث border:1px هو السمك

حيث dashed هو النوع

حيث #000000 هو اللون

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

الكود الثاني

المهمة : حذف الخط من تحت الروابط


الكود:
a:link
{
text-decoration: none;
}

a:visited
{
text-decoration: none;
}

a:active
{
text-decoration: none;
}



[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

الكود الثالث

المهمة : وضع خلفية ملونة برتقالية على الروابط عند مرور الماوس


الكود:
a:hover
{
[b][color=blue]background: #ffe9c6[/color][/b];
}



لتغيير اللون (للخبراء) عدل على

background: #ffe9c6

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

الكود الرابع

المهمة : وضع حقوق لمنتداك أسفل حقوق أحلى منتدى


#page-footer
الكود:
[center]{
[b][color=darkgreen]width: 950px; height: 80px[/color][/b];
background: url([color=blue][b][url=http://www.up.6y6y.com/uploads/dd1674342e.png]http://www.up.6y6y.com/uploads/dd1674342e.png[/url][/b][/color]);
}[/center]


لتغيير الصورة استبدل الرابط

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

للتحكم بالطول و العرض للمساحة التي ستظهر فيها الصورة (للخبراء)

width: 950px; height: 80px

حيث width هو العرض

و height هو الارتفاع

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

الكود الخامس

المهمة : يجعل شكل الأكواد مميز في المواضيع مثل هنا


الكود:
.code {
-moz-border-radius-bottomleft: 8px;
-moz-border-radius-bottomright: 8px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-topright: 8px;
[b][color=blue]background-color: #feffc4[/color][/b] ;
background-image: url('[b][color=darkgreen][url=http://i29.tinypic.com/ke89ll.jpg]http://i29.tinypic.com/ke89ll.jpg[/url][/color][/b]');
background-repeat: repeat;
[b][color=teal]border : 1px dotted #ef9e10[/color][/b];
[b][color=purple]color : #000000[/color][/b];
display: block;
[color=navy][b]max-width: 800px[/b][/color];
overflow: auto;
padding: 7px;
}



[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
هو رابط الصورة الخلفية

للخبراء يمكنهم التعديل على الكود حيث

background-color: #feffc4
هو لون الخلفية

border : 1px dotted #ef9e10
لون و نوع وسمك الحدود

color : #000000
هو لون الخط

max-width: 800px
هو أقصى عرض

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

الكود السادس

المهمة : يجعل شكل الاقتباسات مميز مثل هنا



الكود:
.quote{
-moz-border-radius-bottomleft: 8px;
-moz-border-radius-bottomright: 8px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-topright: 8px;
[b][color=blue]background-color: #feffc4[/color][/b] ;
background-image: url('[b][color=darkgreen][url=http://i29.tinypic.com/ke89ll.jpg]http://i29.tinypic.com/ke89ll.jpg[/url][/color][/b]');
background-repeat: repeat;
[b][color=teal]border : 1px dotted #ef9e10[/color][/b];
[b][color=purple]color : #000000[/color][/b];
display: block;
[b][color=navy]max-width: 800px[/color][/b];
overflow: auto;
padding: 7px;
}


[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
هو رابط الصورة الخلفية

للخبراء يمكنهم التعديل على الكود حيث

background-color: #feffc4
هو لون الخلفية

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
هو رابط الصورة الخلفية

border : 1px dotted #ef9e10
لون و نوع وسمك الحدود

color : #000000
هو لون الخط

max-width: 800px
هو أقصى عرض

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

الكود السابع

المهمة : وضع خلفية للأزرار عند مرور الماوس



الكود:
input.liteoption:hover {
background-color : #fff;
background-image: url('[color=blue][b][url=http://i44.tinypic.com/301hraq.gif]http://i44.tinypic.com/301hraq.gif[/url][/b][/color]');
background-position: top;
font-weight : bold;
[b][color=darkgreen]color: #8d1717[/color][/b];
}

input.mainoption:hover {
background-color : #000;
background-image: url('[b][color=blue][url=http://i44.tinypic.com/301hraq.gif]http://i44.tinypic.com/301hraq.gif[/url][/color][/b]');
background-position: top;
font-weight : bold;
[b][color=darkgreen]color: #8d1717[/color][/b];
}

button.button2:hover, input.button2:hover {
border-width: 2px;
border-style: outset;
border-color: #000000;
background-image: url('[color=blue][b][url=http://i44.tinypic.com/301hraq.gif]http://i44.tinypic.com/301hraq.gif[/url][/b][/color]');
background-position: top;
[color=darkgreen][b]color: #8d1717[/b][/color];
background-position: 0 100%;
}


[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
هو رابط الصورة الخلفية

للخبراء يمكنهم التعديل على الكود حيث

color: #8d1717
هو لون الخط

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]


المجموعة الجديدة من الأكواد بتاريخ 25-11-2009

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

الكود الثامن

المهمة : جعل الفوتر في الوسط


الكود:

div.page-footer
{
position: center;
}



[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

الكود التاسع

المهمة : جعل الحدود بشكل احترافي وبخلفية مثل هنا
كذلك الملاحة والحقوق


الكود:
 
div.gen
{
width: 940px;
border : 1px dotted #000000;
-moz-border-radius-bottomleft: 8px;
-moz-border-radius-bottomright: 8px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-topright: 8px;
background-image: url('http://i87.servimg.com/u/f87/11/37/34/39/mwa03-15.gif');
background-repeat: repeat;
}

td.bodyline{
-moz-border-radius-bottomleft: 8px;
-moz-border-radius-bottomright: 8px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-topright: 8px;
border-width: 1px;
border-color: #000000;
}

td.nav{
-moz-border-radius-bottomleft: 8px;
-moz-border-radius-bottomright: 8px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-topright: 8px;
background-image: url('http://i87.servimg.com/u/f87/11/37/34/39/mwa03-15.gif');
background-repeat: repeat;
border : 1px dotted #2db9e3;
}

div.gensmall{
-moz-border-radius-bottomleft: 8px;
-moz-border-radius-bottomright: 8px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-topright: 8px;
background-image: url('http://i87.servimg.com/u/f87/11/37/34/39/mwa03-15.gif');
background-repeat: repeat;
border : 1px dotted #2db9e3;
}

td.gensmall{
-moz-border-radius-bottomleft: 8px;
-moz-border-radius-bottomright: 8px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-topright: 8px;
background-image: url('http://i87.servimg.com/u/f87/11/37/34/39/mwa03-15.gif');
background-repeat: repeat;
border : 1px dotted #2db9e3;
font-weight: bold
}



[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

الكود العاشر

المهمة : جعل خط حقوق أحلى منتدى بخط tahoma



الكود:
 

a.copyright{
border:0;
background:none;
font-family: Tahoma;
font-size: 15px;
}


[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

الكود الحادي عشر

المهمة : لتغيير لون عنوان الموضوع و من على الخط



الكود:

h1.cattitle{
color:#950000;
}
a.cattitle{
color:#950000;
}

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

الكود الثاني عشر

المهمة : الأزرار بشكل احترافي وبخلفية مثل هنا



الكود:
 input,textarea, #text_editor_iframe {
background: url(http://i87.servimg.com/u/f87/11/37/34/39/mwa03-15.gif);
border-color : #2db9e3 !important;
font-size: 20px;
border-width:1px !important;
border-style:solid !important;
-moz-border-radius: 9px !important;
}
input:hover , textarea:hover , #text_editor_iframe:hover {
border-color : #950000 !important;
color:#950000;
}


1/لجعل الصوره كخلفيه للاقسام انسخ جميع الكود واجعله في
CSS ورقة
واضف رابط الصوره في مكانهى المناسب
واضف صوره زي ماتبي متحركه اوثابته
مصغره او كبيرة الحجم لايهم

الكود:

[color=violet]td.row1,td.row3.over:hover {
background-image: url(" رابط الصوره");
}

td.row2,td.row1.over:hover {
background-image: url(" رابط الصوره");
}

td.row3{
background-image: url(" رابط الصوره");
}

td.row3Right,td.spaceRow {
background-image: url(" رابط الصوره");
} [/color]


[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
2/ لتغير الخلفيه الثانيه للمنتدى كصوره


الكود:
[color=violet][font=Courier New].bodyline{
background-image: url("ضع رابط الصوره");
}[/font][/color]

مثال :

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]


[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
3 / لجعل حدود الاقسام في منتداك بتلمع او حدود متقطعه على حسب الصوره

الكود:
[color=violet][font=Courier New].forumline{
background-image: url("ضع رابط الصوره");
}[/font][/color]

استعمل احد هاذه الصور كمثال

لجعل الحدود بتلمع ومتحركه
الصوره

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

رابط الصوره
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

او هاذه وهي الافضل
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
رابط الصوره
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]



لجعل الحدود متقطعه
الصوره

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

رابط الصوره
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]



[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
لعمل واجهه حقوق منتداك
الكود:
[color=violet]#page-footer {
background : #ffefe7 url(ضع رابط الصوره هنا);
}[/color]

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
لجعل روابط منتداك بتظهر بصور مصغره
هاذا الكود بيعمل في جميع النسخ
الكود:
[color=violet][font=Courier New]a:hover {
background-image: url(ضع هنا رابط الصوره);
border-bottom: 0px solid #105289;;
}[/font][/color]




[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]


عدل سابقا من قبل azad rojbeyani في السبت فبراير 13, 2010 8:08 pm عدل 6 مرات
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://www.rojfilms.com
رحمة

رحمة


عدد المساهمات : 132
تاريخ التسجيل : 15/11/2009

جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Empty
مُساهمةموضوع: رد: جميع الاكواد الخاصة بمنتديات للنسخة phpbb2   جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Icon_minitimeالأربعاء ديسمبر 23, 2009 3:39 am

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
الرجوع الى أعلى الصفحة اذهب الى الأسفل
ممدوح السروى

ممدوح السروى


عدد المساهمات : 646
تاريخ التسجيل : 17/11/2009

جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Empty
مُساهمةموضوع: رد: جميع الاكواد الخاصة بمنتديات للنسخة phpbb2   جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Icon_minitimeالأربعاء ديسمبر 23, 2009 4:13 am

شكرا يامبدع
الرجوع الى أعلى الصفحة اذهب الى الأسفل
azad
مدير المنتدى
azad


عدد المساهمات : 2480
تاريخ التسجيل : 10/10/2009
العمر : 47
الموقع : http://www.absba.org/showthread.php?t=1004912

جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Empty
مُساهمةموضوع: رد: جميع الاكواد الخاصة بمنتديات للنسخة phpbb2   جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Icon_minitimeالسبت ديسمبر 26, 2009 5:00 am

شكرا لمروركم الطيب
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://www.rojfilms.com
saken

saken


عدد المساهمات : 28
تاريخ التسجيل : 23/01/2010

جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Empty
مُساهمةموضوع: رد: جميع الاكواد الخاصة بمنتديات للنسخة phpbb2   جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Icon_minitimeالإثنين فبراير 01, 2010 3:47 pm





يسلم دياتك يا رب على الموضوع
جد يتسحق التقدير والتميز

الرجوع الى أعلى الصفحة اذهب الى الأسفل
azad
مدير المنتدى
azad


عدد المساهمات : 2480
تاريخ التسجيل : 10/10/2009
العمر : 47
الموقع : http://www.absba.org/showthread.php?t=1004912

جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Empty
مُساهمةموضوع: رد: جميع الاكواد الخاصة بمنتديات للنسخة phpbb2   جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Icon_minitimeالجمعة فبراير 05, 2010 6:13 pm

شكرا لمروركم الغالي و العطر و المميز
يوجودكم و استفادتكم من الموضوع تحلى الموضوع
تحياتي و تقديري
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://www.rojfilms.com
toufik18301

toufik18301


عدد المساهمات : 160
تاريخ التسجيل : 30/01/2010

جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Empty
مُساهمةموضوع: رد: جميع الاكواد الخاصة بمنتديات للنسخة phpbb2   جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Icon_minitimeالجمعة فبراير 05, 2010 10:16 pm

مشكووووووووور والله نفعتنا
الرجوع الى أعلى الصفحة اذهب الى الأسفل
بنت الاسلام

بنت الاسلام


عدد المساهمات : 167
تاريخ التسجيل : 17/12/2009

جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Empty
مُساهمةموضوع: رد: جميع الاكواد الخاصة بمنتديات للنسخة phpbb2   جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Icon_minitimeالسبت فبراير 06, 2010 2:18 am

ماشاء الله رائع جدا
شكرا لك اخى على مجهودك الرائع
بوركت جهودك
الرجوع الى أعلى الصفحة اذهب الى الأسفل
ريم85

ريم85


عدد المساهمات : 58
تاريخ التسجيل : 30/01/2010
الموقع : http://aaaamal.forumactif.com

جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Empty
مُساهمةموضوع: رد: جميع الاكواد الخاصة بمنتديات للنسخة phpbb2   جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Icon_minitimeالأحد فبراير 21, 2010 8:06 pm

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
الرجوع الى أعلى الصفحة اذهب الى الأسفل
الباشمهندس

الباشمهندس


عدد المساهمات : 4
تاريخ التسجيل : 07/04/2011

جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Empty
مُساهمةموضوع: رد: جميع الاكواد الخاصة بمنتديات للنسخة phpbb2   جميع الاكواد الخاصة بمنتديات  للنسخة phpbb2 Icon_minitimeالخميس أبريل 07, 2011 9:21 pm

مشكوووووووووور ع التوبيك اخى الكريم
الرجوع الى أعلى الصفحة اذهب الى الأسفل
 
جميع الاكواد الخاصة بمنتديات للنسخة phpbb2
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1
 مواضيع مماثلة
-
» جميع الاكواد للنسخة الثالثة phpbb3
» كل أكواد css الخاصة بالملف الشخصي للنسخة invision
» كود جعل المنتدى بالخط العريض للنسخة الثانية phpbb2
» كود css لجعل حدود المنتدى لماعا للنسخة phpBB2
» الكود النآدر :كود وضع صوره أعلى الفئات للنسخة الثانية phpbb2 ..

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
 :: قسم تطوير المواقع والاشهار ::   :: اكواد الــــ Html & Css-
انتقل الى: