منتديات اسلام نت
عزيزي الزائر / عزيزتي الزائرة يرجي التكرم بتسجبل الدخول اذا كنت عضو معنا
او التسجيل ان لم تكن عضو وترغب في الانضمام الي اسرة المنتدي
سنتشرف بتسجيلك
شكرا
ادارة المنتدي
https://i.servimg.com/u/f39/16/91/07/32/10351_10.gif


سلام عليكم ورحمة الله وبركاتة يا زائر اهلا بك في اسلام نت
 
الرئيسيةس .و .جالتسجيلدخول

شاطر | 
 

 كود وضع اطار من كل الجهات (مطور ومتوافق مع كل المتصفحات)

اذهب الى الأسفل 
كاتب الموضوعرسالة
محمد أبوفيصل
صاحب الموقع
صاحب الموقع
avatar

تاريخ التسجيل : 30/09/2011
تاريخ الميلاد : 29/08/1984
المشاركات: 2233
نقاط 2147483647
عمري 34
ذكر
الموقع : http://islammnet.own0.com

مُساهمةموضوع: كود وضع اطار من كل الجهات (مطور ومتوافق مع كل المتصفحات)   الثلاثاء يناير 31, 2012 3:48 am

السلام عليكم
كود وضع اطار من كل الجهات (مطور ومتوافق مع كل المتصفحات)
انتشر بيننا كود لوضع ايطارات لمحتوى معين ولكنه غير فعال لانه غير متوافق مع المتصفحات

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

صورة لفكرة الكود



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

الكود جزئين جزء html
وcss



كود html

الكود:

<!-- Box >> Start -->
<div class="box">
 
    <!-- Box Header >> Start -->
    <div class="box-header">
        <div class="box-header-right"></div>
        <div class="box-header-left"></div>
    <!-- Box Header >> End -->
    </div>
 
    <!-- Box Body >> Start -->
    <div class="box-body">
        <div class="box-body-right">
        <div class="box-body-left">
        اي شيء تريده  المحتويات
        </div>
        </div>
    <!-- Box Body >> End -->
    </div>
 
    <!-- Box Footer >> Start -->
    <div class="box-footer">
        <div class="box-footer-right"></div>
        <div class="box-footer-left"></div>
    <!-- Box Footer >> End -->
    </div>
 
<!-- Box >> End -->
</div>

كود css

الكود:


/*  ------------------------------------------
    1-Box
    ------------------------------------------  */
.box{
    width:600px;
    margin:0 auto;
    background-color:#FFF;
}
 
/*  ------------------------------------------
    2-Box Header
    ------------------------------------------  */
.box-header{
    background:url(خلفية ممتدة في الاعلى) repeat-x top;
    height:61px;
}
    .box-header-right{
        background:url(صورة اعلى اليمين) no-repeat top right;
        height:61px;
        width:203px;
        float:right;
    }
    .box-header-left{
        background:url(صورة اعلى اليسار) no-repeat top left;
        height:61px;
        width:46px;
        float:left;
    }
 
/*  ------------------------------------------
    3-Box Body
    ------------------------------------------  */
.box-body{
    background-color:#FFF;
    text-align:justify;
 
}
    .box-body-right{
        background:transparent url(خلفية ممتدة يمين) repeat-y right;
    }
    .box-body-left{
        background:transparent url(خلفية ممتدة يسار) repeat-y left;
        padding:20px;   
    }
 
/*  ------------------------------------------
    4-Box Footer
    ------------------------------------------  */
.box-footer{
    background:url(خلفية ممتدة بالاسفل) repeat-x bottom;
 
    height:49px;
}
    .box-footer-right{
        background:url(صورة اسفل اليمين) no-repeat bottom right;
        height:49px;
        width:49px;
        float:right;
    }
    .box-footer-left{
        background:url(صورة اسفل يسار) no-repeat bottom left;
        height:49px;
        width:49px;
        float:left;
    }


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





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






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







الرجوع الى أعلى الصفحة اذهب الى الأسفل
معاينة صفحة البيانات الشخصي للعضو http://islammnet.own0.com islammnet93@gmail.com mohmad4_7@hotmail.com mohmad44@yahoo.com mohmad4_7
 
كود وضع اطار من كل الجهات (مطور ومتوافق مع كل المتصفحات)
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
منتديات اسلام نت :: القســــم تعليمي المنتديات احلى منتداى :: التقنيات الاخرى-
انتقل الى:  

 





nwail


السلام عليكم ورحمة الله وبركاته .

احبتنا زوار الموقع الكرام نود اعلامكم جميعا بان المنتدى مفتوحاً للجميع لذلك فلا تبخلوا علينا بزيارتكم والتصفح ولو بالقراءة والدعاء لا نريد ان نجبركم على التسجيل للتصفح نريدكم فقط ان استفدتم شيئاً من الموقع بان تدعو من قلبك لصاحب الموضوع والعاملين بالموقع ودمتم بحفظ الله ورعايته "خير الناس أنفعهم للناس"

للتسجيل اضغط هـنـا

اعوذ بالله من الشيطان الرجيم {اَللَهُ لا إِلَهَ إلا هو اَلحي ُ القَيَوم لا تأخذه سِنَةٌ ولا نوْمٌ لَّهُ مَا فيِِ السَمَاوَاتِ وَمَا في اَلأَرْضِ مَن ذَا الَّذِي يَشفَعُ عِنْدَهُ إِلاَّ بِإِذْنِهِ يَعْلَمُ مَا بَينَ أَيدِيهِمْ ِوَمَا خَلْفَهم وَلا َيُحِيطُونَ بشَيءٍ مِنْ علمِهِ إِلاَ بِمَا شَآء وَسعَ كُرْسِيُّهُ السَمَاوَاتِ وَالأَرضِ وَلاَ يَؤُدُه حِفْظُهُمَا وَهُوَ العَليُّ العَظِيمُ}


facebook


المواضيع الأخيرة
» الشيخ عبد الباسط عبد الصمد عالى الجوده كامل مقطع يبكى القلب HD
من طرف محمد أبوفيصل الجمعة سبتمبر 14, 2018 7:02 am

» آيات الحج بصوت فضيلة الشيخ أ.د. سعود بن إبراهيم الشريم حفظه الله.
من طرف محمد أبوفيصل الجمعة سبتمبر 14, 2018 7:01 am

» خير متاع الدنيا
من طرف محمد أبوفيصل الجمعة سبتمبر 14, 2018 7:01 am

» رعد محمد الکردي ,, قراءة ما تيسر من {سورة المنافقون + سورة التين}
من طرف محمد أبوفيصل الجمعة سبتمبر 14, 2018 7:00 am

» إبداع القارئ رعد الكردي في رمضان 1439 تلاوة خيالية من سورة هود
من طرف محمد أبوفيصل الجمعة سبتمبر 14, 2018 6:59 am

» الداعية محمود الحسنات | قصة جليبيب | شاهد للنهاية
من طرف محمد أبوفيصل الجمعة سبتمبر 14, 2018 6:58 am

» جديد وحصري تعريف سكاي ستار 2 Technisat v4.6.0
من طرف adel16dz السبت مايو 26, 2018 2:18 am

» حصريا كود سرفرات المشاهدة المباشرة
من طرف محمد أبوفيصل الخميس نوفمبر 16, 2017 9:55 am

» تحميل برنامج بلوستاك 2017 كامل مجانا للكمبيوتر
من طرف محمد أبوفيصل الأربعاء نوفمبر 15, 2017 12:05 pm

» تحميل برنامج BENTLEY WATERCAD V8I SS6 (X86/X64)
من طرف محمد أبوفيصل الأربعاء نوفمبر 15, 2017 11:23 am