شرح مصور لتوزيع الاستايل وطريقه تقطيعه بشكل احترافي من دوره تصميم شكة كوكب اخر

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

كيف حالكم

هذا درس مصور لطريقه توزيع وتقطيع الاستايل بشكل واضح تماما

لان كثير حصلته يعاني من هذي المشكله وحبيت وضحها بشكل اكثر خاص للمشتركين في دوره تصميم استايل برعايه شبكة كوكب اخر


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

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

طبعا هذا استايل تم تصميمه من احد اعضاء الدوره لكن فيه كذا مشكله

1_ تشابك او تداخل الهيدر والفوتر مع الاقسام ( وهذا خطا )

2_ عدم تطابق نقطه التمدد الموجوده بالاقسام فوق بعض ووجود صور تشوه التمدد

3_ عدم تطابق الصور بعد التقطيع فوق بعض مباشره بحجم وعرض واحد

عموما انا راح اطرح الصوره قبل الشرح عليها

وراح اطرحها بعد الشرح عليها

وراح اطرح صوره خاليه من خلفيه للاستايل لتوضح بشكل اكبر



طبعا هذي الصوره التي تم تطبيقها والي عليها الملاحظات التي سبق ذكرها




ومثل مانتو شايفين تداخل الاقسام مع الهيدر والفوتر

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


عموما راح نشوف الحين الصوره وفوقها الشرح





راح نبتدي من الهيدر

طبعا الهيدر مثل ماسبق شرحه ممكن تعمله بكذا طريقه

ممكن تصير الصور فيه من 2 الى الى يعجبك في التقطيع

فا انا الحين بالصوره وضحت ان الصوره 1 الي مكتوب عليها صوره هيدر بكذا معنا صوره رقم ( 1 ) والتمدد الي بجنبها بنفس اللون تعتبر صوره رقم ( 2 )

لو تلاحظ في الصورتين كلهم في ارتفاع واحد

طبعا في الهيدر والفوتر مايهم العرض

المهم فقط هو الارتفاع بحيث ماتصير صوره اطول من الثانيه بكذا راح يصير في نقص للصوره الي هي قصيره لان في صوره اطول منها

فا من المهم ان صور الي بالهيدر تصير بارتفاع واحد والفوتر لهم ارتفاهم الخاص فيهم

طيب لو تلاحظ بصوره الهيدر مع صوره التمدد تبعها ماهي متداخله مع صور الاقسام الي تحتها

راح تشوف مربع بلون احمر لصوره الهيدر والتمدد تبعها مصولين عن المربع الي باللون الازرق الي هي للاقسام

لان لو دخلت صور الهيدر على الاقسام بكذا الصور الي بالهيدر راح تشوفها بالاقسام

فا من المهم انك تعملها بهذي الطريقه وتصير صور الهيدر بداخل المربع الخاص فيها وماتطلع خارج المربع وتدخل في مربع الاقسام

بكذا الهيدر لو وزعناه راح تنزل الصوره باليمين والصوره الثانيه الخاصه بالتمدد راح تمدد من بعد صوره الهيدر الى الجزء الاخر من الاستايل او الى نهايته بحيث يكتمل الهيدر

__________

بكذا فهمنا مشكله الهيدر

نجي الحين للفوتر وهو تقريبا نفس ماتكلمنا عنه بالهيدر تماما

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

فا ضروري التركيز في هذي النقطه

_________

طيب نجي للنطقه المهمه والاصعب تقريبا في الاستايل او الي عليها الشرح بشكل اكثر

الي هي الاقسام

طيب راح نمشي خطوه بخطوه لكن نحتاج تركيز اكثر

انا الحين قطعت الاقسام الى 14 صوره

وكل صوره لها رقمها وحدودها

راح اذكر كل رقم وارجع للصوره وشوف كيف متطابقه مع الرقم الي بقول لك عليه

طبعا قبل اي شئ راح اوضح نقطه

اذا بتعمل توزيع للاقسام وتبيها متمدد لازم تعملها بهذي الطريقه

راح يصير التوزيع معك على الفرونت بيج في الجداول

3×3

انا بقول لك كيف 3×3 وكيف بتنزل الصور فيها

نفرض ان هذا الجدول الي راح تعمله بالفرونت بيج للاقسام

وعملنا الجدوال 3×3

بحيث يطلع معنا كذا الجدول مع ترقيمي له علشان تفهم اكثر





طيب

الحين بتقول كيف عملت 9 جداول مع ان الصور الي معنا 14

طيب انا راح اقول لك كيف ومنها راح تفهم ليه انا رقمتهم وعملت كل مربع وله لون وحدود خاصه فيه

شوف معي التوزيع تبع الاستايل

راح نحط الصوره رقم ( 1 ) في جدول رقم ( 1 )

بكذا نزلنا اول صوره للاقسام من اليسار

طيب الحين

خلصنا من اول زاويه

نروح للزاويه الثانيه

عطني صوره رقم ( 5 ) من الاستايل وننزلها في جدول رقم ( 3 )

بكذا نزلنا صورتين الاطراف العلويه للاقسام

طيب الحين عطني صوره رقم ( 8 ) من الاستايل وننزلها في جدول رقم ( 7 )

بكذا نزلنا اول صوره من اليسار في الاسفل

طيب الحين عطني صوره رقم (12) من الاستايل وننزلها في جدول رقم ( 9 )

بكذا نزلنا الاهم والي هي اطراف الاقسام

طيب الحين باقي معنا الجداول رقم ( 2 , 4, 5 , 6 , 8 )

طبعا جدول ( 5 ) هذا ماراح تنزل فيه صور لانه خاص بالكود الي راح تنزله للاقسام الي من قوالب الاستايل

طيب

الحين بتكلم نقطه مهمه

لو تشوف معي صوره رقم ( 1) في الاستايل مع صوره رقم (5)

راح تحصلهم في ارتفاع واحد ومافي وحده ارفع من الثانيه

طيب لو تشوف معي صوره رقم (1) في الاستايل مع صوره رقم ( 7)

راح تحصلهم بنفس العرض ومافي وحده اعرض من الثانيه

لان لو صار في وحده اعرض من الثانيه او اطول من الثانيه بكذا وش الي راح يصير معنا راح يطلع محل الفضاوه هذي لون الخلفيه

لان الجدول راح يمتد على عرض او طول اكبر صوره

فا لازم نخليهم متواسين بالعرض والطول في اثناء التقطيع علشان ماتصير معنى هذي الفجوه

بكذا فهمنى ليه عملتهم بجداول وكل جدول له لون علشان تشوف كيف متواسين بالعرض والطول ومافي شئ اكبر من شئ

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

طيب الحين نرجع للتوزيع

نبي الحين ننزل اعمده الاقسام لان الاعمده ماراح نعطيها جداول بداخلها

عطني صوره رقم ( 6 ) من الاستايل وننزلها في جدول رقم (4)

بكذا نزلنا اول عامود من اليسار

طيب عطني صوره رقم (7) من الاستايل وننزلها في جدول رقم (6)

بكذا صارو معنا العامودين كاملين من اول صوره في الاعلى الى اخر صوره بالاسفل وكلهم بنفس العرض في استقامه وحده

طيب الحين نجي لباقي الصور الي قلنا عنهم

راح تشوف في الجدول باقي معنى جدول رقم (2) وجدول رقم (8) فاضين ومافيهم صور

مع ان باقي معنى اكثر من صورتين

الحين راح اقول لك كيف تنزلهم

طيب الحين نشوف الاستايل وكم صوره بالاعلى باقيه معنى

باقي معنى صوره رقم ( 2,3,4 )

بكذا معنى 3 صور

منهم صورتين اطراف ووحده تمدد بالنص الي هي صوره رقم ( 3 )

بكذا نعمل في داخل الجدول رقم (2) وجدول رقم (8) نعمل بداخله 3 جداول بالعرض

راح يطلع معنا بهذي الطريقه





بكذا التوزيع صار اوكيه

الحين نكمل التوزيع

عطني صوره رقم ( 2) من الاستايل وننزلها في جدول رقم (10)

عطني صوره رقم (3) من الاستايل وهي صوره التمدد وننزلها في جدول رقم (11)

عطني صوره رقم (4) من الاستايل وننزلها في جدول رقم (12)

بكذا اكتمل معنى الصف العلوي من الاقسام بصور الاطراف من اليمين الى اليسار بالتمدد وكل شئ

طيب نكمل الي تحت

عطني صوره رقم (9) من الاستايل وننزلها في جدول رقم (13)

عطني صوره رقم (10) من الاستايل وهي صوره التمدد وننزلها في جدول رقم (14)

عطني صوره رقم (11) من الاستايل وننزلها في جدول رقم (15)

بكذا اكتمل معنى الصور الي بالاسفل من الطرف اليمين الى اليسار بالتمدد وكل شئ

اعتقد العمليه سهله جدا بس تحتاج تركيز وتفهمها

وصدقوني راح تشوفو مافي اسهل منها

طبعا هذي صوره التوزيع بشكل نهائي بدون خلفيه الاستايل علشان توضح العمليه بشكل صافي





راح اذكر كم ملوحظه فقط للمعلوميه

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

ملحوظه (2) : تم وضع اكثر من نقطه تمدد في الفوتر ولا يمنع من ذالك ومن الممكن الاكتفاء بواحده فقط بعمل جدول واحد وعملي للجدول خلفيه بصوره التمدد وفوقها الصوره الفوتر

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

ملحوظه (4) : توجد لخبطه في اخر الارقام وتم ذكر ان عدد الصور للاقسام هي 14 والاساس هي 13 لكن النوم سلطان بن مفلح مصور لتوزيع الاستايل وطريقه تقطيعه بشكل احترافي من دوره" title="171" class="inlineimg" />

اتمنى الحين وصله الفكره

وراجع الدرس اكثر من مره مع التطبيق راح تشوف العمليه بدت تدخل في راسك بكل سهوله

انا بالاول كنت اشوفها معقده جدا لكن يوم فهمتها صرت اللعب بالاستايل على كيفي مصور لتوزيع الاستايل وطريقه تقطيعه بشكل احترافي من دوره" title="128" class="inlineimg" />

عموما هذا الشرح اهداء مني لكم فوق الدوره للتوضيح بشكل عام

فان اصبت فمن ربي وان اخطات فمن نفسي والشيطان

اعتذر عن اي خطا لكن يعلم الله اني اكتبه وماني شايف الشاشه ههههههههه

اتمنى التوفيق للجميع واشوف ابداعتكم

ولا تحرمونى من دعائكم

الشرح يخلو من اي حقوق للفائده العامه اتمنى فقط دعاء خالص من القلب

الرجاء عند النقل ذكر المصدر

اداره التنظيك والمتابعه
لشبكة كوكب اخر
مـكـوكـب أخـر ـن
http://www.kokb777.net/vb/index.php

في امان الله

كلمات البحث

Product, BBcode, language, Plugin, Style, game, iPod, Galaxy, Samsung, iPhone, games, Lessons, Design, Designs, Default Style, Styles, Free Designs, Announcements, Announcement, Web Development, Development Forums, Forum upgrades, Forum upgrade, Scripts, Hosting, Hosting companies, Licensing forums, Licensing forum, Forum Language, Problems and solutions, AdSense, AdWords, Analytics, Sitemaps, Sitemap, Product Search, Java, Ajax, asp, php, web2, web 2, شبكة كوكب آخر, معهد كوكب آخر, دروس, استايل, استايلات, دورات استايلات, دورات استايل, دروس تعليميه, دروس تعليمة, تعليم, مراحل, شرح, شروحات, كتب, بحث, بحوث تعليميه, بحوث, بحوث دراسيه, بحوث دراسية, بحوث تعليميه, بحوث تعليمة, دوره, دورة, دورات, فلاشات, فلاش, فلاشات تعليمية, فلاشات تعليمه, نموذج, نماذج, نماذج تعليمه, نماذج تعليمة, نماذج دروس, استمارات, استماره, استمارة, العاب, لعب, صرقعه, دردشه, دردشة, شات, سوالف, تعارف, حب, غزل, عشق, حزن, صور, افلام, قصص, فوتوشوب, تطوير مواقع, ستايلات مجانية, استايلات مجانيه, منتدى, المنتدى, كوكب آخر, برامج, دروس, شروحات, تصاميم, تعارف, مواقع, تعليم, فلاتر, سويتش, دردشه, قصائد, خواطر, بطاقات, صور, افلام, العاب, ستايلات مجانيه, إستضافه, إستضافة, استضافة, استضافه, دعم فني, دعم منتديات, شروحات, برامج, برمجة, تصاميم مجانية, تصميم, تمبلت, تعريب, هاكات, نسخ منتديات, جوالات, ماسنجر, بلاك بيري, ايفون, جالكسي تاب, جالكسي, ايبود, مستعمل, اجارات, عقارات, شقق, شقه, شقة, سياره, سيارة, سيارات, نغمات, نغمه, نغمة, عرس, اعراس, زواج, زواجات, حفله, حفلة, حفلات, تصوير

---

avp lw,v gj,.du hghsjhdg ,'vdri jr'dui fa;g hpjvhtd lk ],vi jwldl a;m ;,;f hov

الصور مو مبينة للاسف

الصور تطلع مافيها مشكله

جربي مره ثانيه ممكن من اتصالك


ولو مانفع رفعتها في المرفقات

الصور تطلع مافيها مشكله


جربي مره ثانيه ممكن من اتصالك

ولو مانفع رفعتها في المرفقات

المشكلة انه مو كل الصور مبينه بس 3 صور

تم طرح كل صوره تحتها الرابط تبعها

لو مافتحت من الرابط الاتصال عندك فيه مشكله

شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية .