+ ---- - طريقة التركيب خاصة فقط بالنسخة phpbb2 وربما تعمل على النسخ الاخرى من لوحة الادارة - مظهر المنتدى - الوان - ورقة css ثم ضع الكود ثم سجل الكود الاول المهمة : وضع خلفية لاسم العضو <TABLE style="ZOOM: 1" border=0 cellSpacing=1 cellPadding=0 width="90%" align=center> <TR> <td align=left>اقتباس:</TD></TR> <TR> <td class=quote align=left>.name a{ text-decoration: none; border:1px dashed #000000; background: url(https://2img.net/h/oi44.tinypic.com/301hraq.gif); }</TD></TR></TABLE> لتغيير الخلفية يمكنك استبدال https://2img.net/h/oi44.tinypic.com/301hraq.gif ولتحكم في الحدود (للخبراء) يمكنكم التعديل على border:1px dashed #000000 حيث border:1px هو السمك حيث dashed هو النوع حيث #000000 هو اللون الكود الثاني المهمة : حذف الخط من تحت الروابط <TABLE style="ZOOM: 1" border=0 cellSpacing=1 cellPadding=0 width="90%" align=center> <TR> <td align=left>اقتباس:</TD></TR> <TR> <td class=quote align=left>a:link { text-decoration: none; } a:visited { text-decoration: none; } a:active { text-decoration: none; }</TD></TR></TABLE> الكود الثالث المهمة : وضع خلفية ملونة برتقالية على الروابط عند مرور الماوس <TABLE style="ZOOM: 1" border=0 cellSpacing=1 cellPadding=0 width="90%" align=center> <TR> <td align=left>اقتباس:</TD></TR> <TR> <td class=quote align=left>a:hover { background: #ffe9c6; }</TD></TR></TABLE> لتغيير اللون (للخبراء) عدل على background: #ffe9c6 الكود الرابع المهمة : وضع حقوق لمنتداك أسفل حقوق أحلى منتدى <TABLE style="ZOOM: 1" border=0 cellSpacing=1 cellPadding=0 width="90%" align=center> <TR> <td align=left>اقتباس:</TD></TR> <TR> <td class=quote align=left>#page-footer { width: 950px; height: 80px; background: url(http://www.up.6y6y.com/uploads/dd1674342e.png); }</TD></TR></TABLE> لتغيير الصورة استبدل الرابط http://www.up.6y6y.com/uploads/dd1674342e.png للتحكم بالطول و العرض للمساحة التي ستظهر فيها الصورة (للخبراء) width: 950px; height: 80px حيث width هو العرض و height هو الارتفاع الكود الخامس المهمة : يجعل شكل الأكواد مميز في المواضيع مثل هنا <TABLE style="ZOOM: 1" border=0 cellSpacing=1 cellPadding=0 width="90%" align=center> <TR> <td align=left>اقتباس:</TD></TR> <TR> <td class=quote align=left>.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('https://2img.net/h/oi29.tinypic.com/ke89ll.jpg'); background-repeat: repeat; border : 1px dotted #ef9e10; color : #000000; display: block; max-width: 800px; overflow: auto; padding: 7px; }</TD></TR></TABLE> https://2img.net/h/oi29.tinypic.com/ke89ll.jpg هو رابط الصورة الخلفية للخبراء يمكنهم التعديل على الكود حيث background-color: #feffc4 هو لون الخلفية border : 1px dotted #ef9e10 لون و نوع وسمك الحدود color : #000000 هو لون الخط max-width: 800px هو أقصى عرض الكود السادس المهمة : يجعل شكل الاقتباسات مميز مثل هنا <TABLE style="ZOOM: 1" border=0 cellSpacing=1 cellPadding=0 width="90%" align=center> <TR> <td align=left>اقتباس:</TD></TR> <TR> <td class=quote align=left>.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('https://2img.net/h/oi29.tinypic.com/ke89ll.jpg'); background-repeat: repeat; border : 1px dotted #ef9e10; color : #000000; display: block; max-width: 800px; overflow: auto; padding: 7px; }</TD></TR></TABLE> https://2img.net/h/oi29.tinypic.com/ke89ll.jpg هو رابط الصورة الخلفية للخبراء يمكنهم التعديل على الكود حيث background-color: #feffc4 هو لون الخلفية https://2img.net/h/oi29.tinypic.com/ke89ll.jpg هو رابط الصورة الخلفية border : 1px dotted #ef9e10 لون و نوع وسمك الحدود color : #000000 هو لون الخط max-width: 800px هو أقصى عرض الكود السابع المهمة : وضع خلفية للأزرار عند مرور الماوس <TABLE style="ZOOM: 1" border=0 cellSpacing=1 cellPadding=0 width="90%" align=center> <TR> <td align=left>اقتباس:</TD></TR> <TR> <td class=quote align=left>input.liteoption:hover { background-color : #fff; background-image: url('https://2img.net/h/oi44.tinypic.com/301hraq.gif'); background-position: top; font-weight : bold; color: #8d1717; } input.mainoption:hover { background-color : #000; background-image: url('https://2img.net/h/oi44.tinypic.com/301hraq.gif'); 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('https://2img.net/h/oi44.tinypic.com/301hraq.gif'); background-position: top; color: #8d1717; background-position: 0 100%; }</TD></TR></TABLE> https://2img.net/h/oi44.tinypic.com/301hraq.gif هو رابط الصورة الخلفية للخبراء يمكنهم التعديل على الكود حيث color: #8d1717 هو لون الخط المجموعة الجديدة من الأكواد بتاريخ 25-11-2009 الكود الثامن المهمة : جعل الفوتر في الوسط <TABLE style="ZOOM: 1" border=0 cellSpacing=1 cellPadding=0 width="90%" align=center> <TR> <td align=left>اقتباس:</TD></TR> <TR> <td class=quote align=left> div.page-footer { position: center; } </TD></TR></TABLE> الكود التاسع المهمة : جعل الحدود بشكل احترافي وبخلفية مثل هنا كذلك الملاحة والحقوق <TABLE style="ZOOM: 1" border=0 cellSpacing=1 cellPadding=0 width="90%" align=center> <TR> <td align=left>اقتباس:</TD></TR> <TR> <td class=quote align=left> 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 } </TD></TR></TABLE> الكود العاشر المهمة : جعل خط حقوق أحلى منتدى بخط tahoma <TABLE style="ZOOM: 1" border=0 cellSpacing=1 cellPadding=0 width="90%" align=center> <TR> <td align=left>اقتباس:</TD></TR> <TR> <td class=quote align=left> a.copyright{ border:0; background:none; font-family: Tahoma; font-size: 15px; } </TD></TR></TABLE> الكود الحادي عشر المهمة : لتغيير لون عنوان الموضوع و من على الخط <TABLE style="ZOOM: 1" border=0 cellSpacing=1 cellPadding=0 width="90%" align=center> <TR> <td align=left>اقتباس:</TD></TR> <TR> <td class=quote align=left> h1.cattitle{ color:#950000; } a.cattitle{ color:#950000; } </TD></TR></TABLE> الكود الثاني عشر المهمة : الأزرار بشكل احترافي وبخلفية مثل هنا <TABLE style="ZOOM: 1" border=0 cellSpacing=1 cellPadding=0 width="90%" align=center> <TR> <td align=left>اقتباس:</TD></TR> <TR> <td class=quote align=left>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; } </TD></TR></TABLE> الكود الثالث عشر وضع نصوص و صور الرئيسية في الأسفل http://www.mhmoudko.com/montada-f40/topic-t9634.htm لا تنسونا من صالح الدعاء الكود الرابع عشر تكبير الخط عند مرور الماوس فوق عناوين المواضيع في الأقسام <TABLE style="ZOOM: 1" border=0 cellSpacing=1 cellPadding=0 width="90%" align=center> <TR> <td align=left>اقتباس:</TD></TR> <TR> <td class=quote align=left> a.topictitle:hover { font-size: 18px; } </TD></TR></TABLE> يمكنكم التحكم بحجم الخط من font-size: 18px في الكود الكود الخامس عشر تغيير لون "مثبت" و "اعلان" عند مرور الماوس فوق الموضوع <TABLE style="ZOOM: 1" border=0 cellSpacing=1 cellPadding=0 width="90%" align=center> <TR> <td align=left>اقتباس:</TD></TR> <TR> <td class=quote align=left> div.topictitle:hover { color:#0000FF; } </TD></TR></TABLE> color:#0000FF لتغيير اللون الكود السادس عشر تغيير لون و حجم "مثبت" و "اعلان" بدون مرور الماوس <TABLE style="ZOOM: 1" border=0 cellSpacing=1 cellPadding=0 width="90%" align=center> <TR> <td align=left>اقتباس:</TD></TR> <TR> <td class=quote align=left> div.topictitle { color:#FF0000; font-size: 22px; } </TD></TR></TABLE> color:#FF0000 لتغيير اللون font-size: 22px لتغيير الحجم الكود السابع عشر كود رائع لوضع صورة أو خلفية فوق عنوان الموضوع مثل هنا : https://2img.net/h/oi46.tinypic.com/2jg9co8.gif <TABLE style="ZOOM: 1" border=0 cellSpacing=1 cellPadding=0 width="90%" align=center> <TR> <td align=left>اقتباس:</TD></TR> <TR> <td class=quote align=left> th.thRight { background-image: url('https://2img.net/h/oi46.tinypic.com/2jg9co8.gif'); background-repeat: repeat; } </TD></TR></TABLE> https://2img.net/h/oi46.tinypic.com/2jg9co8.gif هو رابط الخلفية |
اهم اكوادcss اهم اكوادcss
ضياءالشاهر- ~المدير العــام~
- عدد المساهمات : 3974
نقــاطي : 23292
التقيـــيــم : 66
تاريخ التسجيل : 09/02/2011
العمر : 66
الموقع : العراق ..الفلوجه .
المزاج : رايق
- مساهمة رقم 1