home الرئيسيةpeople_outline الأعضاء vpn_key دخول


chatالمواضيع الأخيرة
تصميم بنر access_timeأمس في 6:21 pmpersonرؤوف
طلب بتصميم غلافaccess_timeالجمعة يناير 18, 2019 5:15 pmpersonمودي الشرقاوي
1طلب بتغيير لون access_timeالجمعة يناير 18, 2019 3:18 pmpersonAhmed Alshiqaqi
طلب بتصميم شبيه باحترافيهaccess_timeالجمعة يناير 18, 2019 3:11 pmpersonAhmed Alshiqaqi
طلب تصميم شعارaccess_timeالجمعة يناير 18, 2019 11:26 ampersonAhmed Alshiqaqi
طلب تصميم أيقونات لرتب الأعضاء3access_timeالخميس يناير 17, 2019 10:39 pmpersonعمر عدوي1994
طلب تصميم أيقونات لرتب الأعضاء2access_timeالخميس يناير 17, 2019 10:38 pmpersonعمر عدوي1994
طلب تصميم أيقونات لرتب الأعضاءaccess_timeالخميس يناير 17, 2019 10:35 pmpersonعمر عدوي1994
العبرة في القولaccess_timeالخميس يناير 17, 2019 6:27 pmpersonKamila Saher

طريقة عرض الأقسام

لونك المفضل



قالب هيدر بسيط جاهز للتركيب بتقنية css

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

اقدم لكم هيدر بسيط يتكون من هيدر يسار ويمين وتمدد ولوغو

الخطوات للتركيب

اولا يتم اضافة الكود الاتي قبل وسم </head>

أي تبححث عن الوسم وتضيف اعلاة اكواد css

الكود:


    <style>
  #header {
    background-image: url(http://i68.servimg.com/u/f68/16/46/77/76/uo-ouo22.png);
    background-repeat: repeat-x;
    height: 251px;
}

#header #head-left {
    background-image: url(http://i68.servimg.com/u/f68/16/46/77/76/uo-ouo20.png);
    background-repeat: no-repeat;
    float: left;
    height: 251px;
    width: 348px;
    position:relative;
}





#header #logo {
    background-image: url(http://i68.servimg.com/u/f68/16/46/77/76/uo_ouo16.png);
    background-repeat: no-repeat;
    float: left;
    height: 74px;
    width: 272px;
    position:relative;
    margin-top: 60px;
    margin-left: 120px;     
         
}

#header #head-right {
          background-image: url(http://i68.servimg.com/u/f68/16/46/77/76/uo-ouo21.png);
    background-repeat: no-repeat;
    float: right;
    height: 251px;
    width: 440px;
    position: relative;
}
   </style> 


ثم تبحث عن  {JAVASCRIPT}

وتضيف تحته الوسم الاتي

الكود:



<div id="header">

<div id="head-left">
</div>

<div id="head-right">
<div id="logo"></div></div>
</div></div></div>




الطريقة دة هي تكويد بتقنية css

ثم اعمل سجل النتيجة


https://i.servimg.com/u/f68/16/46/77/76/uo_ouo25.jpg

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

اتمنى انني افدتكم بالدرس البسيط وبالهيدر

دمتم بخير

رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

موضوع متألق من طرفك
يعطيك ألف عاافية ع المشااركة الرائعة
بانتظاار المزيد من قلمك المبدع
تحيااتي لك 




رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

طرح راقي ومميز بكل معانيه
دائما للتميز عنوان بقلمك
ابدعتي اختي الكريمة
ودي وتقديري
وتقييمي المتواضعوردة حمراء



رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

قالب جميل جداااا
تسلم الاياادي

رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

السلام عليكم ورحمة الله وبركاته
ألف شكر لكَ على هذا الموضوع المميز و المعلومات القيمة
إنـجاز أكثر رائــــــع
لكن أرجو منكَ عدم التوقف عند هذا الحد
مـنتظرين ابداعتــــــك
دمتـ ودام تألقـك

تحياتــي

رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

طرح مميز
شكرا لك
ابدعت
بانتظار جديدك ان شاء الله
وردة حمراء وردة حمراء وردة حمراء وردة حمراء

رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

شكر جزيلا للطرح القيم
ننتظر المزيد من ابداع مواضيعك الرائعة
تحياتي وتقديري لك


If the plan doesn’t work, change the plan, but never the goal
وردة حمراء وردة حمراء

رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

منورين جميعا

رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

مشكوره على الموضوع الرائع يسلمو حبيبتي


وردة حمراء كن مبتسمأا ,m,nn مهما كانت 24511 الضروف 3.5 وردة حمراء
وردة حمراء نحمد الله 53ع68ح ونشكره 53ع6صك على كل حال 3.5 وردة حمراء
3.7 3.7 3.7 3.7 3.7 3.7 3.7 3.7 3.7 3.7 3.7 3.7 3.7 3.7 3.7 3.7

وردة حمراء الحمد لله 534غ لا اله الا الله 534غ سبحان الله 534غ وردة حمراء

وردة حمراء ي ربي احمي 3.5 بلدي وانصرهم ي رب 3.5 وارجعنا احرارا 3.5 وردة حمراء

رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

شكرا لك

رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

طرح مميز
شكرا لك
بانتظار جديدك


رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

طرح رائع ..احسنت


رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

شكرا عالموضوع
ابدعت
تقبل مروري ^^


اتمنى ان اكون سبب سعادة لمن حولي
وأن لااكون وجعا لاحد
...ربماآ انا لااستطيع إسعآد أحد ..ولكن اقسم انني لا احب ايذاء احد

رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

هيدر اكثر من ممتاز
بارك الله فيك


If the plan doesn’t work, change the plan, but never the goal
وردة حمراء وردة حمراء

رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

هيدر جميل تابع الابداع
وشكرا على الطرح
تقب لمرورى


رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

هيدر رائع اخي

رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

تصميم جميل





رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

جزاكم الله خيراً 
وردة حمراء وردة حمراء وردة حمراء 


سبحان الله والحمدلله ولا إله إلا الله 
 

رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

تصميم جميل





رد: قالب هيدر بسيط جاهز للتركيب بتقنية css

جميل جدآ ورائع
تم تركيبه في منتداي
شكرآ لك
ارسال رد

هــــــام

ندعوك للتسجيل في المنتدى لتتمكن من ترك رد أو تسجيل الدخول اذا كنت من اسرة المنتدى

صلاحيات هذا الموضوع
لاتستطيع الرد على المواضيع في هذا المنتدى