محمد أبوفيصل صاحب الموقع
تاريخ التسجيل : 30/09/2011 تاريخ الميلاد : 29/08/1984 2244 2147483647 40 الموقع : https://islammnet.own0.com
| موضوع: موضوع: أكواد CSS الخاصة بمنتديات اسلام نت الجمعة أكتوبر 14, 2011 5:37 am | |
| [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة] أكواد CSS الخاصة بمنتديات محمودكواقتباس: | تم إضافة أكواد جديدة بتاريخ 25-11-2009 بدايتها من الكود السابع
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة] تم اضافة اكواد جديدة بتاريخ 11-2-2009 بدايتها من الكود الثالث عشر
| [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]طريقة التركيبخاصة فقط بالنسخة phpbb2 وربما تعمل على النسخ الاخرىمن لوحة الادارة - مظهر المنتدى - الوان - ورقة cssثم ضع الكود ثم سجل[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة] الكود الاولالمهمة : وضع خلفية لاسم العضولتغيير الخلفية يمكنك استبدال [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
ولتحكم في الحدود (للخبراء) يمكنكم التعديل على 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[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة] الكود الرابعالمهمة : وضع حقوق لمنتداك أسفل حقوق أحلى منتدىلتغيير الصورة استبدل الرابط [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]للتحكم بالطول و العرض للمساحة التي ستظهر فيها الصورة (للخبراء)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 لتغيير الحجم [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة] الكود السابع عشركود رائع لوضع صورة أو خلفية فوق عنوان الموضوع مثل هنا :[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط][ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] هو رابط الخلفية [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة] الكود الثامن عشركود لوضع خلفية لاعلانات أحلى منتدى مثل هنااقتباس: | 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 للتحكم بالحدود ولونها [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] رابط الخلفية [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة] | |
|