شركة نيوفورايجى



 
الرئيسيةالرئيسية  س .و .جس .و .ج  بحـثبحـث  التسجيلالتسجيل  دخولدخول  

شاطر | 
 

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

اذهب الى الأسفل 
كاتب الموضوعرسالة
soso
الادارة
الادارة
soso

ذكر

عدد الرسائل : 13166
العمر : 18

تاريخ التسجيل : 15/08/2009

مُساهمةموضوع: كود وضع اطار من كل الجهات (مطور ومتوافق مع كل المتصفحات)   الثلاثاء مايو 10, 2011 2:35 pm

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

يسبب بطئ شديد للمنتدى
الحل موجود
وهو استخدام الاسطورة 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://new4egy.0wn0.com/
اهواك
مساعد ادارى
مساعد ادارى
اهواك

ذكر

عدد الرسائل : 2225
العمر : 20

تاريخ التسجيل : 11/04/2011

مُساهمةموضوع: _da3m_2   الأحد يناير 12, 2014 10:49 am

موضوع رائع بوركت




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

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