منتديات شباب السودان اونلاين

منتديات شباب السودان اونلاين

♣°ღ____♥● منتدى شباب السودان اونلاين ♣°ღ____♥●

Like/Tweet/+1

انت غير مسجل

أنت غير مسجل فى منتدى شباب السودان اونلاين . للتسجيل الرجاء إضغط هنـا

نشر على الفيسبوك

ترحيب باالزاير

اهلا وسهلا زائر الكريم , انت لم تقوم بتسجيل الدخول بعد ! يشرفنا ان تقوم بالدخول او التسجيل اذا رغبت بالمشاركة في المنتدي


مجموعة اكواد css لاحلى منتديات

شاطر
avatar
ibrahim

صـاحب المنتدي



الدولة : السودان
الجنس : ذكر
مكان الدراسة : جامعة الرباط الوطنى
عدد المساهمات : 463
النقاط : 15396
العمر : 29

مجموعة اكواد css لاحلى منتديات

مُساهمة من طرف ibrahim في الأربعاء أكتوبر 05, 2011 7:30 am



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

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

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

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



الكود الاول

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

اقتباس:
.name a{
text-decoration: none;
border:1px dashed #000000;
background: url([ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]);
}

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

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

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

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
{
background: #ffe9c6;
}

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

background: #ffe9c6



الكود الرابع

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

اقتباس:
#page-footer
{
width: 950px; height: 80px;
background: url([ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]);
}

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

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

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

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;
background-color: #feffc4 ;
background-image: url('[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]');
background-repeat: repeat;
border : 1px dotted #ef9e10;
color : #000000;
display: block;
max-width: 800px;
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;
background-color: #feffc4 ;
background-image: url('[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]');
background-repeat: repeat;
border : 1px dotted #ef9e10;
color : #000000;
display: block;
max-width: 800px;
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('[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]');
background-position: top;
font-weight : bold;
color: #8d1717;
}

input.mainoption:hover {
background-color : #000;
background-image: url('[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]');
background-position: top;
font-weight : bold;
color: #8d1717;
}

button.button2:hover, input.button2:hover {
border-width: 2px;
border-style: outset;
border-color: #000000;
background-image: url('[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]');
background-position: top;
color: #8d1717;
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('https://i.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('https://i.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('https://i.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('https://i.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(https://i.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;
}



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

وضع نصوص و صور الرئيسية في الأسفل

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


لا تنسونا من صالح الدعاء



الكود الرابع عشر

تكبير الخط عند مرور الماوس فوق عناوين المواضيع في الأقسام

اقتباس:

a.topictitle:hover
{
font-size: 18px;
}

يمكنكم التحكم بحجم الخط من font-size: 18px في الكود



الكود الخامس عشر

تغيير لون "مثبت" و "اعلان" عند مرور الماوس فوق الموضوع

اقتباس:

div.topictitle:hover
{
color:#0000FF;
}

color:#0000FF لتغيير اللون



الكود السادس عشر

تغيير لون و حجم "مثبت" و "اعلان" بدون مرور الماوس

اقتباس:

div.topictitle
{
color:#FF0000;
font-size: 22px;
}

color:#FF0000 لتغيير اللون

font-size: 22px لتغيير الحجم



الكود السابع عشر

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

اقتباس:

th.thRight
{
background-image: url('[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]');
background-repeat: repeat;
}

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



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

كود لوضع خلفية لاعلانات أحلى منتدى مثل هنا

اقتباس:

div.mainmenu
{
min-width: 940px;
-moz-border-radius-bottomleft: 8px;
-moz-border-radius-bottomright: 8px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-topright: 8px;
background-image: url('[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]');
background-repeat: repeat;
border : 1px dotted #2db9e3;
}

min-width: 940px عرض الخلفية

border : 1px dotted #2db9e3 للتحكم بالحدود ولونها

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



لا تنسونا من صالح الدعاء







dola7abeby
درجة العضو

الدولة : مصر
الجنس : ذكر
عدد المساهمات : 1
النقاط : 12731

رد: مجموعة اكواد css لاحلى منتديات

مُساهمة من طرف dola7abeby في الأحد ديسمبر 25, 2011 5:23 pm

ثاااااااااااااانكس يااا باشاااااا
مش عااارف اى حااااجه
ههههع
avatar
ibrahim

صـاحب المنتدي



الدولة : السودان
الجنس : ذكر
مكان الدراسة : جامعة الرباط الوطنى
عدد المساهمات : 463
النقاط : 15396
العمر : 29

رد: مجموعة اكواد css لاحلى منتديات

مُساهمة من طرف ibrahim في الإثنين ديسمبر 26, 2011 7:22 am

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






avatar
hamo.alhag
درجة العضو

الدولة : السودان
الجنس : ذكر
مكان الدراسة : كليةا لامارات التقنية
عدد المساهمات : 124
النقاط : 12325
العمر : 29

رد: مجموعة اكواد css لاحلى منتديات

مُساهمة من طرف hamo.alhag في الأربعاء مايو 02, 2012 3:08 pm

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









avatar
ibrahim

صـاحب المنتدي



الدولة : السودان
الجنس : ذكر
مكان الدراسة : جامعة الرباط الوطنى
عدد المساهمات : 463
النقاط : 15396
العمر : 29

رد: مجموعة اكواد css لاحلى منتديات

مُساهمة من طرف ibrahim في الخميس مايو 03, 2012 5:50 am

جدا اقدم لك طريق الشرح ياسيد
طريقة وضع كود css
اولا لوحة الادارة>>مظهر المنتدى<<الالوان <<ورقة تصميم css


لاحقا سوف نوافيكم فى طريقة وضع كود html وغيره






avatar
hamo.alhag
درجة العضو

الدولة : السودان
الجنس : ذكر
مكان الدراسة : كليةا لامارات التقنية
عدد المساهمات : 124
النقاط : 12325
العمر : 29

رد: مجموعة اكواد css لاحلى منتديات

مُساهمة من طرف hamo.alhag في الخميس مايو 03, 2012 10:23 am

مشكوووووووووووووووووووووووووووووور يامدير









avatar
حبيب الكل
درجة العضو

الجنس : ذكر
عدد المساهمات : 18
النقاط : 13233

رد: مجموعة اكواد css لاحلى منتديات

مُساهمة من طرف حبيب الكل في الثلاثاء مايو 08, 2012 8:58 pm

تســــــــــــــلم يامدير على الاكواد القيمة دى

ومشكوووووووووور جد

    الوقت/التاريخ الآن هو الجمعة ديسمبر 14, 2018 5:23 pm