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







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

أعود لكم بدرس ان شاء الله ينال على اعجابكم ..

وان شاء الله يارب يفيد الجميع ..

مجرد اجتهاد مني يحتمل الصواب ويحتمل الخطأ..

ونظرا ً لما رأيت من كثرة الطلبات عليه ..
وهي ضبط الستايل علي أي دقة شاشه بدون منطقة تمدد..

أحبب اني اطرح لكم هالفكره بطريقه سهله ان شاء الله عليكم..

وان شاء الله الكل يستفيد ..

×÷×÷×÷×÷×÷×÷×

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

طبعا ً هالدرس هيدر وفوتر بس بدون أعمدة..
الأعمدة اذا تبيها تصممها لحالها وتركبها لحالها بطريقه معينه ..
علشان تجي جنب الهيدر وفوقه وكذلك الفوتر ..
وهي طريقه سهله جداً ماحبيت اتطرق لها ..

وهي بالضبط مثل شرح الاستاذ تركي في تركيب البرواز..
بس ماعليك الا انك تخلي البرواز:
فوق ويمين ويسار الهيدر
تحت ويمين ويسار الفوتر

وبتضبط معك الاعمدة ..

بس انا حبيت اشرح طريقة تمدد صورة الهيدر والفوتر فقط ..
فبسم الله الله نبدأ /

أولا ً :
صمم لك هيدر وفوتر ويكون مقاس العرض 777 بيكسل ..

..

ثانيا ً :
بعد التصميم اذهب الى الفرونت بيج .. امسح مافي التعليمات البرمجيه
ثم ادخل على تصميم مره اخرى .. ادخل على خصائص الصفحه..
اجعلها يمين - يسار

انشئ جدول صف واحد وعامود واحد..
ادرج صورة الهيدر ..
بتلاحظ انها جت بمقاسها دون تمدد وعلى اليمين .. حلو

الحين الزر اليمين على الصورة واضغط خصائص الصورة ..
وسوي مثل مالصورة موضحه ..


1-أشر علامة صح على كلمة Specify size
2-اجعل العرض بالمئوي بالتأشير على in percent
3-اجعل العرض 100 بوضع رقم 100 في خانة Width [اجباري]

الآن نروح للتعليمات البرمجيه ..
ننسخ الكود .. ونلصقه في في قالب الهيدر فوق :
$spacer_open

$_phpinclude_output

بكذا نكون انتهينا من الهيدر .. وبإذن الله اللي سوى الخطوات ومشى معي صح,,
بيضبط معه الهيدر ان شاء الله ..


الآن نجي للفوتر ..
نعمل نفس اللي عملنها في الهيدر ,,مع الفوتر ..
ننشئ جدول وندرج صورة الفوتر ونغير خصائص الصورة..
وبعد ماننتهي ننسخ الكود ونلصقه في قالب الفوتر آخر شي ,,
تحت :
//-->
</script>

وبكذا نكون بعد انتهينا من الفوتر ..

×÷×÷×÷×÷×÷×÷

وبالنسبه للي يبغى الهيدر والفوتر متمددين على اي دقة شاشة وبالأعمده..
يتبع الآتي ..

التصميم في الفوتوشوب .. نقوم بوضع أعمده عادي مثل اي تصميم ستايل قبل ..
الاختلاف فقط في التقطيع ..

بالنسبه للهيدر يكون ثلاث قطع ..
1-صوره يمين
2-صورة يسار
3-صورة وسط (وهي اللي بنغير خصائصها مثل الشرح فوق)

بالنسبه للفوتر يكون ثلاث قطع ..
1-صوره يمين
2-صورة يسار
3-صورة وسط (وهي اللي بنغير خصائصها مثل الشرح فوق)

وبالنسبه للأعمده ..
1-صورة يمين بنفس مقاس الصوره اليمين في الهيدر والفوتر..
2-صورة يسار بنفس مقاس الصورة اليسار في الهيدر والفوتر ..

بالنسبه للتركيب .. نفس طريقة الاستاذ تركي بالضبط..

جدول مكون من ثلاث أعمده وثلاث صفوف..

في الصف الاول العامود الاول:
صورة الهيدر اليمين..(ادراج صورة)
في الصف الاول العامود الثاني:
صورة الهيدر الوسط..(ادراج صورة) "وهذي اللي تغير خصائصها عشان تتمدد مع اي دقة شاشه"
في الصف الاول العامود الثالث:
صورة الهيدر اليسار..(ادراج صورة)

في الصف الثاني العامود الاول:
صورة العامود اليمين..(ادراج خليه)
في الصف الثاني العامود الثاني:
مانحط شي بس نحط أمر توسيط ..مثل شرح الاستاذ تركي
في الصف الثاني العامود الثالث:
صورة العامود اليسار ..(ادراج خليه)

في الصف الثالث العامود الأول:
صورة الفوتر اليمين ..(ادراج صورة)
في الصف الثالث العامود الثاني:
صورة الفوتر الوسط..(ادراج صورة) "وهذي اللي تغير خصائصها عشان تتمدد مع اي دقة شاشه"
في الصف الثالث العامود الثالث:
صورة الفوتر اليسار..(ادراج صورة)

وهذا كل شي ..بالنسبه للهيدر والفوتر مع الأعمده ..

ان شاء الله يكون واضح ..
×÷×÷×÷×÷×÷×÷

انتهى الدرس ..

ان شاء الله اكون وفقت في توصيل الملعومه لكم بأسهل طريقه..

مثل ماقلت أول مجرد اجتهاد .. يحتمل الخطأ ويحتمل الصواب
وان شاء الله يارب تكون هذي هي الطريقه اللي تستخدم من قبل كبار المصممين ..

اي استفسار اي اضافه .. تفضلوا

تمنياتي للجميع بالتوفيق ..

والسلام عليكم..


رابط الدرس

http://www.traidnt.net/vb/showthread.php?t=11341