اشهار مواقع وخدمة اصحاب المنتديات وجلب زوار وارشفه وتصاميم واكواد وهاكات ومساعده الاعضاء
 
الرئيسيةالبوابةاليوميةس .و .جبحـثالأعضاءالمجموعاتالتسجيلدخول

شاطر | 
 

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

استعرض الموضوع السابق استعرض الموضوع التالي اذهب الى الأسفل 
كاتب الموضوعرسالة
red_dragon
عضو جـديـد

avatar

احترام قوانين المنتدى : احترام قوانين المنتدى
الجنس : ذكر
عدد المساهمات : 7
نقاط النشــاط نقاط النشــاط : 21
السٌّمعَة : 10
تاريخ الميلاد : 06/10/1988
العمر العمر : 29

مُساهمةموضوع: كود وضع اطار من كل الجهات (مطور ومتوافق مع كل المتصفحات)   الخميس سبتمبر 08, 2011 7:52 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;
}




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

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

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
منتديات اشهار سوفت :: الأكواد الإنسيابية Css-
انتقل الى:  
 
الساعة الأن بتوقيت (مصر)
جميع الحقوق محفوظة لـمنتديات اشهار سوفت
 Powered by Aseer Al Domoo3 ®eshar.yoo7.com
حقوق الطبع والنشر©2012 - 2011