دليل الإشهار العربي
هل تريد التفاعل مع هذه المساهمة؟ كل ما عليك هو إنشاء حساب جديد ببضع خطوات أو تسجيل الدخول للمتابعة.


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

أضغط هنا وأشترك مجانا الان

العدد مفتوح
 

 اكواد استايل تومبيلات جاهزة للاستخدام

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

البلد : فلسطين
الجنس : ذكر
المساهمات : 3756
نقاط النشاط : 5787

اكواد استايل تومبيلات جاهزة للاستخدام Empty
مُساهمةموضوع: اكواد استايل تومبيلات جاهزة للاستخدام   اكواد استايل تومبيلات جاهزة للاستخدام Emptyالجمعة 3 سبتمبر 2021 - 14:20

بسم الله الرحمن الرحيم


اقدم لكم في هذا الموضوع اكواد html&css جاهزة لتصميم استايل رباعي وتقطعيه واستخدامه مباشرة مع الاكواد
ويكون الاستايل بالهيدر صورتان يمين ويسار وتمدد بالمنتصف 
بالفوتر يمين ويسار وتمدد بالمنتصف
وعلى يمين ويسار الموقع يوجد تمدد يربط بين الهيدر والفوتر
مثال
اكواد استايل تومبيلات جاهزة للاستخدام 7013
ومثال على التقطيعه التي تم الاعتماد عليها
اكواد استايل تومبيلات جاهزة للاستخدام 6912


شرح استخدام الاكواد
نتوجه نحو لوحة الادارة - مظهر المنتدى - التومبيلات والقوالب - ادارة عامة 
نفتح قالب overall_header ونبحث عن {JAVASCRIPT} ونضيف الكود التالي اسفله 
الكود:
<div id="centent">
<div class="h1">
<div class="habari-b">
<div class="habari-r"></div>
<div class="habari-l"></div>
</div>
<div class="asp-r">
<div class="asp-l">

ومن ثم نفتح قالب overall_footer_end ونضيف في اخر القالب الكود التالي :
الكود:
<div id="foter" style="width: 100%; height: 136px">
<div class="f-r"></div>
<div class="f-l">
<a class="u4" href="#" title="DES:HABARI88  ," target="_blank" style="left: 21px; bottom: 5px; height: 126px"></a>
</div>
<div class="f-bg">
</div>
</div>

ومن ثم نتوجه الى 
لوحة الادارة - مظهر المنتدى - الوان - ورقة css
واضف الاكواد التالية مع التعديلات المشروحة بالكود نفسه
الكود:
.habari-b {

    background-image:url('تمدد هيدر');
   background-repeat: repeat-x;
 height: 450px;
}
 
.habari-r{
 background-image: url('هيدر يمين');
 width: 501px;
 height: 450px;
 background-repeat: no-repeat;
 float: right;
 position: relative;
}

.habari-l{
 background-image: url('هيدر يسار');
 height:450px;
 width:237px;
 float:left;
 position:relative
}

.asp-r {

    background: url('تمدد يمين') repeat-y scroll right center transparent;    
}


.asp-l {

    background: url('تمدد يسار') repeat-y scroll left center transparent;
    padding: 58px;
 }
 

.f-bg {
 background-image:url('تمدد فوتر');
 height:136px;
 background-repeat:repeat;
}
.f-r {
 background-image:url('فوتر يمين');
 height:136px;
 width:224px;
 background-repeat:no-repeat;
 float:right;
}
 .f-l{
  background-image:url('فوتر يسار');
  height:136px; width:237px; float:left; background-repeat:no-repeat;position:relative;
 }

طبعا يجب تغيير ارتفاع وعرض الصور بكود الـcss بحسب الصور اللي انت بتستخدمها
وبعد التركيب رح ييجي الاستايل عندك كامل وفي حال كان فيه فراغ باطراف الاستايل فقط قم باضافة الكود التالي في ورقة css
الكود:
body {
margin: 0;
}

وهيك كل شي جاهز
تم الشرح بواسطتي : Mc Nabulsy
جميع الحقوق محفوظة لدليل الاشهار العربي
بالتوفيق للجميع
والسلام ختام


توقيع : Mc nabulsy






لا اله الا الله

AsHeK EgYpT يعجبه هذا الموضوع

الرجوع الى أعلى الصفحة اذهب الى الأسفل
فارس الدعاية
المديـر العــام

فارس الدعاية

البلد : المغرب العربي
الجنس : ذكر
المساهمات : 2355
نقاط النشاط : 4645

اكواد استايل تومبيلات جاهزة للاستخدام Empty
مُساهمةموضوع: رد: اكواد استايل تومبيلات جاهزة للاستخدام   اكواد استايل تومبيلات جاهزة للاستخدام Emptyالجمعة 3 سبتمبر 2021 - 14:29

احسنت الطرح عزيزي بالتوفيق لكgg444g


Mc nabulsy يعجبه هذا الموضوع

الرجوع الى أعلى الصفحة اذهب الى الأسفل
أفندينا
 
 
أفندينا

البلد : مصر
الجنس : ذكر
المساهمات : 256
نقاط النشاط : 294

اكواد استايل تومبيلات جاهزة للاستخدام Empty
مُساهمةموضوع: رد: اكواد استايل تومبيلات جاهزة للاستخدام   اكواد استايل تومبيلات جاهزة للاستخدام Emptyالإثنين 6 سبتمبر 2021 - 19:49

@Mc nabulsy شرح ممتاز اخي
لكن جربت اطبقه وطلع في مشكله
في الهيدر شوف الصوره للهيدر

اكواد استايل تومبيلات جاهزة للاستخدام P_2075tnv6p0

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


توقيع : أفندينا


أهلا و سهلا بكم في منتديات قسوة وداع

اكواد استايل تومبيلات جاهزة للاستخدام Do

https://q-wada3.net/vb/
الرجوع الى أعلى الصفحة اذهب الى الأسفل
Mc nabulsy
 
 
Mc nabulsy

البلد : فلسطين
الجنس : ذكر
المساهمات : 3756
نقاط النشاط : 5787

اكواد استايل تومبيلات جاهزة للاستخدام Empty
مُساهمةموضوع: رد: اكواد استايل تومبيلات جاهزة للاستخدام   اكواد استايل تومبيلات جاهزة للاستخدام Emptyالإثنين 6 سبتمبر 2021 - 20:04

@أفندينا كتب:
@Mc nabulsy شرح ممتاز اخي
لكن جربت اطبقه وطلع في مشكله
في الهيدر شوف الصوره للهيدر

اكواد استايل تومبيلات جاهزة للاستخدام P_2075tnv6p0

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


اخي ركز في اللي كتبته بالموضوع بتفهم اكثر
اقتباس :
ويكون الاستايل بالهيدر صورتان يمين ويسار وتمدد بالمنتصف 
بالفوتر يمين ويسار وتمدد بالمنتصف
وعلى يمين ويسار الموقع يوجد تمدد يربط بين الهيدر والفوتر



يعني هيدر وفوتر وجوانب فقط ما جبت سيرة هيكل منتدى والوان وخطوط وغيره

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

width هو العرض
height هو الارتفاع
كله موجود اسفل رابط كل صورة باكواد الـ css


توقيع : Mc nabulsy






لا اله الا الله
الرجوع الى أعلى الصفحة اذهب الى الأسفل
أفندينا
 
 
أفندينا

البلد : مصر
الجنس : ذكر
المساهمات : 256
نقاط النشاط : 294

اكواد استايل تومبيلات جاهزة للاستخدام Empty
مُساهمةموضوع: رد: اكواد استايل تومبيلات جاهزة للاستخدام   اكواد استايل تومبيلات جاهزة للاستخدام Emptyالإثنين 6 سبتمبر 2021 - 21:05

طيب اخي ايش بالنسبه للهيكل و الخطوط والالوات
+
المقاسات كلها مظبوته و رغم هذا طلع شكل الهيدر مو مظبوط


توقيع : أفندينا


أهلا و سهلا بكم في منتديات قسوة وداع

اكواد استايل تومبيلات جاهزة للاستخدام Do

https://q-wada3.net/vb/
الرجوع الى أعلى الصفحة اذهب الى الأسفل
أفندينا
 
 
أفندينا

البلد : مصر
الجنس : ذكر
المساهمات : 256
نقاط النشاط : 294

اكواد استايل تومبيلات جاهزة للاستخدام Empty
مُساهمةموضوع: رد: اكواد استايل تومبيلات جاهزة للاستخدام   اكواد استايل تومبيلات جاهزة للاستخدام Emptyالأربعاء 8 سبتمبر 2021 - 10:04



توقيع : أفندينا


أهلا و سهلا بكم في منتديات قسوة وداع

اكواد استايل تومبيلات جاهزة للاستخدام Do

https://q-wada3.net/vb/
الرجوع الى أعلى الصفحة اذهب الى الأسفل
Mc nabulsy
 
 
Mc nabulsy

البلد : فلسطين
الجنس : ذكر
المساهمات : 3756
نقاط النشاط : 5787

اكواد استايل تومبيلات جاهزة للاستخدام Empty
مُساهمةموضوع: رد: اكواد استايل تومبيلات جاهزة للاستخدام   اكواد استايل تومبيلات جاهزة للاستخدام Emptyالخميس 9 سبتمبر 2021 - 18:51

@أفندينا كتب:
طيب اخي ايش بالنسبه للهيكل و الخطوط والالوات
+
المقاسات كلها مظبوته و رغم هذا طلع شكل الهيدر مو مظبوط

اخي كملها انت مش صعبة الالوان والهيكل بلوحة الادارة - مظهر المنتدى - الوان
والهيكل من خلال قوالب التومبيلات موجود كثير اكواد وقوالب جاهزة + من ادارة الصور بلوحة التحكم

وبالنسبة للمقاسات لازم يكون الارتفاع متساوي دائما عشان تزبط لأني مجرب الكود وشغال 100%


توقيع : Mc nabulsy






لا اله الا الله
الرجوع الى أعلى الصفحة اذهب الى الأسفل
أفندينا
 
 
أفندينا

البلد : مصر
الجنس : ذكر
المساهمات : 256
نقاط النشاط : 294

اكواد استايل تومبيلات جاهزة للاستخدام Empty
مُساهمةموضوع: رد: اكواد استايل تومبيلات جاهزة للاستخدام   اكواد استايل تومبيلات جاهزة للاستخدام Emptyالجمعة 10 سبتمبر 2021 - 14:32

@Mc nabulsy
اقتباس :
وبالنسبة للمقاسات لازم يكون الارتفاع متساوي دائما عشان تزبط لأني مجرب الكود وشغال 100%
الارتفاع متساوي كله اخي رغم هذا ما يظبت
+ هل هناك مساحه معينه للعمل قبل التقطيع
انا اشتغل المساحه على 1000 عرض في 700 ارتفاع


توقيع : أفندينا


أهلا و سهلا بكم في منتديات قسوة وداع

اكواد استايل تومبيلات جاهزة للاستخدام Do

https://q-wada3.net/vb/
الرجوع الى أعلى الصفحة اذهب الى الأسفل
Mc nabulsy
 
 
Mc nabulsy

البلد : فلسطين
الجنس : ذكر
المساهمات : 3756
نقاط النشاط : 5787

اكواد استايل تومبيلات جاهزة للاستخدام Empty
مُساهمةموضوع: رد: اكواد استايل تومبيلات جاهزة للاستخدام   اكواد استايل تومبيلات جاهزة للاستخدام Emptyالجمعة 10 سبتمبر 2021 - 15:06

@أفندينا كتب:
@Mc nabulsy
اقتباس :
وبالنسبة للمقاسات لازم يكون الارتفاع متساوي دائما عشان تزبط لأني مجرب الكود وشغال 100%
الارتفاع متساوي كله اخي رغم هذا ما يظبت
+ هل هناك مساحه معينه للعمل قبل التقطيع
انا اشتغل المساحه على 1000 عرض في 700 ارتفاع

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


توقيع : Mc nabulsy






لا اله الا الله
الرجوع الى أعلى الصفحة اذهب الى الأسفل
AsHeK EgYpT
نائب المدير

AsHeK EgYpT

البلد : مصر
الجنس : ذكر
المساهمات : 10426
نقاط النشاط : 3643

اكواد استايل تومبيلات جاهزة للاستخدام Empty
مُساهمةموضوع: رد: اكواد استايل تومبيلات جاهزة للاستخدام   اكواد استايل تومبيلات جاهزة للاستخدام Emptyالجمعة 10 سبتمبر 2021 - 16:10

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


توقيع : AsHeK EgYpT


اكواد استايل تومبيلات جاهزة للاستخدام Aiyo--12
<<<< القانون العام لعلبة الدردشة >>>>

وَإِذا أَتَتكَ مَذَمَّتي مِن ناقِصٍ فَهِيَ الشَهادَةُ لي بِأَنِّيَ كامِلُ

Mc nabulsy يعجبه هذا الموضوع

الرجوع الى أعلى الصفحة اذهب الى الأسفل
 
اكواد استايل تومبيلات جاهزة للاستخدام
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1

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