مرحبا عزيري الزائر قم بالتسجيل الأن من هنا
إذا لديك بالفعل حساب لدينا قم بتسجيل الدخول الأن



اكواد منتديات vBulletin 3.x.x كود , اكواد , تعديلات , BBCode - خاص باكواد المنتديات فقط BBCode [ يمنع وضع الهاكات في هذا القسم ]

عمل فوتر رائع بتقنية الـ css للمنتديات مع مثال
عمل فوتر رائع بتقنية الـ css للمنتديات مع مثال
 

تابعني على facebook
تابعني على twitter
تابعني على google plus
تابعني على youtube
تجربتي
2
تابعني على instaram
غير متواجد
أبوعبدالله
المستشار
عضو لدية أكثر من 2000 مشاركةعضو لدية أكثر من 2000 مشاركة
قديم 03-01-2011, 07:34 PM
#1  
 
قديم 03-01-2011, 07:34 PM
#1  
تاريخ الإنضمام: 07-06-2010
الدولة: بيشة
المشاركات: 2,334
الإعجابات التي قدمها للأعضاء 235   تم شكره 129 مرة في 106 مشاركة
معدل تقييم المستوى: 3474
أبوعبدالله لديه الكثير ونحن فخورين بهأبوعبدالله لديه الكثير ونحن فخورين بهأبوعبدالله لديه الكثير ونحن فخورين بهأبوعبدالله لديه الكثير ونحن فخورين بهأبوعبدالله لديه الكثير ونحن فخورين بهأبوعبدالله لديه الكثير ونحن فخورين بهأبوعبدالله لديه الكثير ونحن فخورين بهأبوعبدالله لديه الكثير ونحن فخورين بهأبوعبدالله لديه الكثير ونحن فخورين به
افتراضي عمل فوتر رائع بتقنية الـ css للمنتديات مع مثال



أقدم لكم شرح لكيفية عمل فوتر احترافى بـ css


اليكم الكود مرفق لكم فى المنتدى

ما عليك سوى تعديل معلومات موقعك او منتداك وتعديل روابط المنتدى لديك
ومرفق لكم صورة مثال






HTML & CSS

<style type="text/css">
* {
 
outline:none;
 
margin:0;
 
padding:0;
}
body {
 
direction:rtl;
}
.
footer_css {
 
background-color:#1e45b2;/*لوضع لون للخلفيه*/
 
height:auto;
 
width:100%;
 
overflow:hidden;
 
position:relative;
}
.
copyrights {
 
position:absolute;
 
bottom:10px;
 
left:10px;
 
text-decoration:none;
 
color:#ccc;
 
text-shadow:1px 1px 1px #000;
}
.
copyrights:hover {
 
color:#FFF;
}
.
footer_css div {
 
float:right;
 
overflow:hidden;
 
height:100%;
 
width:270px;/*عرض كل ديف*/
 
border-left:1px solid #FFF;/*لعمل حدود من ناحيه اليسار حيث ال 1 بيكسل هو عرض الحد و ال solid اى خط واحد سميك وفى الاخر لون الخط*/
 
padding:10px;/*لعمل الحشو والمسافه الداخليه*/
}
.
footer_css div h3 {
 
color:#FFF;
}
.
footer_css div p {
 
text-align:justify;
 
font:13px Droid Arabic KufiGenevaDroid Arabic Kufi;
 
text-shadow:1px 1px 1px #083834;
}
.
footer_css div ul {
 
padding:0;
 
margin:0;
 list-
style-type:none
}
.
footer_css div ul li {
 
padding:5px;
 
border-bottom:1px dashed #d87e61; 
}
.
footer_css div ul li:hover {
 
border-bottom:1px dashed #FFF; 
}
.
footer_css div ul li a {
 
display:block;
 
color:#000;
 
text-shadow:1px 1px 1px #083834;/*لعمل ظل للكتابه*/
 
text-decoration:none;
}
.
footer_css div ul li a:hover {
 
color:#FFF;
}
</
style>
<
font size="2" face="Droid Arabic Kufi" color="#FFFFFF">
</
head>
</
font>
<
body>
<
div class="footer_css">
 <
div>
     <
h3>
  <
font size="2" face="Droid Arabic Kufi">
  <
span style="font-weight: 400">
  <
img style="vertical-align:middle" alt="footer" src="http://vbegy.info/up/lesson/footer_img.png" width="25" height="25" /> 
  </
span>من نحن</font></h3>
        <
p><font face="Droid Arabic Kufi" size="2"> <span lang="ar-eg">
  <
font color="#FFFFFF">منتدى
  
</font>
  <
a href="http://www.deltaprog.com/"><font color="#FFFFFF">دلتــ بروج ــا</font></a><font color="#FFFFFF">
  </
font> </span><font color="#FFFFFF">&nbsp;نسعى<span lang="ar-eg"
  
دائما</spanلتقديم
  
<span lang="ar-eg">أهم وأحدث البرامج وأندر التعريفات لآندر الاجهزة 
  الجديدة والقديمة ونقدم أيضا أهم الشروحات الخاصة بالحاسب الالى
</span>
  <
span lang="ar-eg">وأ</span>فضل الشروحات عن التقنيات 
  الحديث والتطوير وافاده الناس
<span lang="ar-eg"ومشاركة الاعضاء 
  بالمواضيع العامة الهادفة 
  والمواضيع الاسلامية لنعم الاسلام بين الامم العربية جميعا 
,,,,</span></font></font></p>
  <
p><span lang="ar-eg"><font color="#FFFFFF" face="Droid Arabic Kufi" size="2">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp
  
مع تحيات
  
</font>
  <
a href="http://www.deltaprog.com/">
  <
font face="Droid Arabic Kufi" size="2" color="#FFFFFF">دلتــ بروج ــا</font></a></span></p>
    </
div>
 <
div>
     <
h3>
  <
font size="2" face="Droid Arabic Kufi">
  <
img style="vertical-align:middle" alt="footer" src="http://vbegy.info/up/lesson/footer_img.png" width="25" height="25" /> اقسام الموقع</font></h3>
        <
ul>
         <
li><a href="http://www.deltaprog.com"><font size="2" face="Droid Arabic Kufi" color="#FFFFFF">الصفحة الرئيسية</font></a></li>
         <
li><a href="http://www.deltaprog.com/index.php?pageid=translate"><font size="2" face="Droid Arabic Kufi" color="#FFFFFF">ترجمة فورية</font></a></li>
         <
li><a href="http://www.deltaprog.com/vb"><font size="2" face="Droid Arabic Kufi" color="#FFFFFF">المنتدى</font></a></li>
         <
li><a href="http://www.deltaprog.com/vb/deltaprog-f6"><font size="2" face="Droid Arabic Kufi" color="#FFFFFF">أهم الرامج</font></a></li>
        <
li><a href="#"><font size="2" face="Droid Arabic Kufi" color="#FFFFFF">wordpress</font></a></li>
        </
ul>
    </
div>
 <
div>
     <
h3>
  <
font size="2" face="Droid Arabic Kufi">
  <
img style="vertical-align:middle" alt="footer" src="http://vbegy.info/up/lesson/footer_img.png" width="25" height="25" /> اقسام الموقع</font></h3>
        <
ul>
         <
li><a href="#"><font size="2" face="Droid Arabic Kufi" color="#FFFFFF">تصميم</font></a></li>
         <
li><a href="#"><font size="2" face="Droid Arabic Kufi" color="#FFFFFF">تطوير</font></a></li>
         <
li><a href="#"><font size="2" face="Droid Arabic Kufi" color="#FFFFFF">برمجه</font></a></li>
         <
li><a href="#"><font size="2" face="Droid Arabic Kufi" color="#FFFFFF">css</font></a></li>
         <
li><a href="#"><font size="2" face="Droid Arabic Kufi" color="#FFFFFF">wordpress</font></a></li>
        </
ul>
    </
div>
 <
font face="Droid Arabic Kufi">
<
class="copyrights" href="http://deltaprog.com/">
 <
font size="2" color="#FFFFFF">deltaprog</font></a><font size="2" color="#FFFFFF"> </font>
 </
font>
</
div

توقيعي
تجربتي

التعديل الأخير تم بواسطة AlM6weR ; 11-03-2016 الساعة 08:08 AM
رد مع اقتباس

تابعني على facebook
تابعني على twitter
تابعني على google plus
تابعني على youtube
معهد المطوّر
1
تابعني على instaram
متواجد
AlM6weR
مؤسس معهد المطوّر
عضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركة
قديم 04-01-2011, 12:17 AM
#2  
 
قديم 04-01-2011, 12:17 AM
#2  
تاريخ الإنضمام: 07-06-2010
الدولة: الرياض
العمر: 40
المشاركات: 7,808
الإعجابات التي قدمها للأعضاء 285   تم شكره 747 مرة في 568 مشاركة
معدل تقييم المستوى: 17822
AlM6weR قمه في الابداعAlM6weR قمه في الابداعAlM6weR قمه في الابداعAlM6weR قمه في الابداعAlM6weR قمه في الابداعAlM6weR قمه في الابداعAlM6weR قمه في الابداعAlM6weR قمه في الابداعAlM6weR قمه في الابداعAlM6weR قمه في الابداعAlM6weR قمه في الابداع
افتراضي رد: عمل فوتر رائع بتقنية الـ css للمنتديات مع مثال


بارك الله فيك يابوعبدالله
موضوع رائع ومميز ومن العيار الثقيل
جار التجربة ..

توقيعي
عَنْ جُوَيْرِيَةَ بنت الحارث، أم المؤمنين رضي الله عنها؛ أَنَّ النَّبِيَّ صلى الله عليه وسلم خَرَجَ مِنْ عِنْدِهَا بُكْرَةً، حِينَ صَلَّى الصُّبْحَ وَهِيَ فِي مَسْجِدِهَا، ثُمَّ رَجَعَ بَعْدَ أَنْ أَضْحَى، وَهِيَ جَالِسَةٌ، فَقَالَ:
((مَا زِلْتِ عَلَى الْحَالِ الَّتِي فَارَقْتُكِ عَلَيْهَا؟)) قَالَتْ: نَعَمْ، قَالَ النَّبِيُّ صلى الله عليه وسلم: ((لَقَدْ قُلْتُ بَعْدَكِ أَرْبَعَ كَلِمَاتٍ، ثَلَاثَ مَرَّاتٍ، لَوْ وُزِنَتْ بِمَا قُلْتِ مُنْذُ الْيَوْمِ لَوَزَنَتْهُنَّ:
سُبْحَانَ اللهِ وَبِحَمْدِهِ عَدَدَ خَلْقِهِ، وَرِضَا نَفْسِهِ وَزِنَةَ عَرْشِهِ، وَمِدَادَ كَلِمَاتِهِ)).

alm6wergmail.com - alm6werlive.com - alm6weryahoo.com

ندعم جميع منتديات الجيل الثالث

مواقعنا :
  1. www.6wer.com
  2. www.alm6wer.com
رد مع اقتباس

9
عضو معهد المطور
ندعم جميع منتديات
الجيل الثالث بتقنية CSS3
غير متواجد
الشامخه
مطوّر مبدع
عضو لدية أكثر من 1500 مشاركةعضو لدية أكثر من 1500 مشاركةعضو لدية أكثر من 1500 مشاركةعضو لدية أكثر من 1500 مشاركةعضو لدية أكثر من 1500 مشاركة
قديم 04-01-2011, 10:37 PM
#3  
 
قديم 04-01-2011, 10:37 PM
#3  
تاريخ الإنضمام: 08-06-2010
الدولة: غَايةُ عُمرِى [ جَنةً ] فِيها أسِـير..|
المشاركات: 1,754
  تم شكره 5 مرة في 5 مشاركة
معدل تقييم المستوى: 1948
الشامخه في بداياتك للشهرهالشامخه في بداياتك للشهره
افتراضي رد: عمل فوتر رائع بتقنية الـ css للمنتديات مع مثال


[size="3"][font="arial"]

أفدتني بمعلومة...كانت لدي معدومة..وأردتْ معرفتها .
شكراً ودعوةً وتقييماً...ولعلها تفي.
سلمتْ


رد مع اقتباس

5280
عضو معهد المطور
ندعم جميع منتديات
الجيل الثالث بتقنية CSS3
غير متواجد
ملك الحصريات
مطوّر مبدع
عضو لدية أكثر من 1500 مشاركةعضو لدية أكثر من 1500 مشاركةعضو لدية أكثر من 1500 مشاركةعضو لدية أكثر من 1500 مشاركةعضو لدية أكثر من 1500 مشاركة
قديم 20-04-2013, 04:48 PM
#4  
 
قديم 20-04-2013, 04:48 PM
#4  
تاريخ الإنضمام: 25-02-2013
المشاركات: 1,544
الإعجابات التي قدمها للأعضاء 193   تم شكره 3 مرة في 3 مشاركة
معدل تقييم المستوى: 1561
ملك الحصريات يسير نحو الشهره
افتراضي رد: عمل فوتر رائع بتقنية الـ css للمنتديات مع مثال


جزاك الله خير
وجعله في موازين حسناتك

رد مع اقتباس

مواقع النشر (المفضلة)

الكلمات الدلالية (Tags)
للمنتديات, مثال, مع, css, بتقنية, رائع, عمل, فوتر

عمل فوتر رائع بتقنية الـ css للمنتديات مع مثال


أدوات الموضوع إبحث في الموضوع
إبحث في الموضوع:

البحث المتقدم

الانتقال السريع
تعليمات المشاركة
لا تستطيع إضافة مواضيع جديدة
لا تستطيع الرد على المواضيع
لا تستطيع إرفاق ملفات
لا تستطيع تعديل مشاركاتك

BB code is متاحة
كود [IMG] متاحة
كود HTML معطلة



المواضيع المتشابهه
الموضوع كاتب الموضوع المنتدى مشاركات آخر مشاركة
[ استفسار ] هل من الممكن وضع هيدر و فوتر الوردبرس بالمنتدى ؟ Yahia طلبات و مشاكل منتديات vBulletin 3.x.x 4 15-02-2015 03:02 PM
[ BBcode ] تعديل رائع على قالب الnavbar اسم العضو بشكل رائع متحرك حصريا صلاح عبد الغنى اكواد منتديات vBulletin 3.x.x 6 14-07-2013 10:37 PM
[ BBcode ] فوتر جاهز بالكامل بتقنية css واحلى تركيب لعيونكم انين الصمت اكواد منتديات vBulletin 3.x.x 8 14-07-2013 10:27 PM
درس عمل هيدر او فوتر لموقع او مدونه بواسطة الانحناء بشاير البرامج العامه والشروحات 2 29-09-2011 08:54 PM



الساعة الآن 08:37 AM