• 0

كيف أجعل عناصر HTML مختلفة في الطول بجانب بعضها بإستخدام CSS؟

ما أقصده هو أنني لدي عناصر من نوع Div ولكنها مختلفة في الطول بحيث أن محتوى كل منها يزيد عن الآخر في الطول، ولكنها تظهر بطريقة غير منظمة مثل التالي:

Untitled.png

 

فأنا لا أريد الفراغات البيضاء، كيف يمكنني عمل هذا مثل الموجود في صفحة أفضل المستخدمين في حسوب IO مثل الصورة:

Capture.PNG

 

عمل Inspect بالجوجل كروم أدوات المطورين ووجدت أنه بالــposition ثم التحكم بعناصر الصفحة، وأعتقد أن قيم مواقع العناصر (left - top - right - bottom) يتم جلبها بالــjQuery ، فهل هنالك كود أو مثال عملي أستطيع الفهم منه كيفية عمل شيء كهذا ؟

وشكراً .

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 1

إذا كنت في بداية التعلم أنصحك بمتابعة دروس قناة الزيرو ستجد دروس BOM ثم DOM

بعدها إذا أردت تعلم تقنية Ajax ستجدها في قناة الأستاذ عبد الله عيد

وأنصحك دائما إذا واجهت مشكلة أو دالة لم تجدها في JavaScript إبحث أولا في Google

ستجد في الغالب الحل في stackoverflow.com أو developer.mozilla.org

وبعد أن تتعلم ما سبق أنصحك بتعلم البرمجة الكائنية ستجد لها شرحا على هذه القناة

2 اشخاص أعجبوا بهذا

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

استخدم خاصية float ضمن div

واذا اردت عرض 3 div ضمن السطر الواحد، اعطي عرض موحد ضمن ستايل div

width: 30%;

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0
بتاريخ 1 ساعة قال طارق جهاد:

استخدم خاصية float ضمن div

واذا اردت عرض 3 div ضمن السطر الواحد، اعطي عرض موحد ضمن ستايل div

width: 30%;

لم يعمل الأمر نهائياً، هل يتم الأمر عن طريقة الjQuery؟؟
لأنني عملت inspect element لأرى في حسوب IO كيف يتم عملها ثم وجدتها بالPosition absolute ..

هل يمكنك عرض مثال كود لكي أفهم لو سمحت ؟

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0
بتاريخ 15 ساعات قال zakariamouhid:

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

http://codepen.io/zakariamouhid/pen/jyxKxa

شكراً لك صديقي @zakariamouhid ، تم عمل الموضوع بكل بساطة وإحترافية..

___
وجدت لك مساهمات عديدة هنا وفي حسوب I/O ولك فيها خير مثال بأنك محترف في الجافاسكربت، ما شاء الله.
كيف تنصح شخص يود أن يعرف في الجافاسكربت ما يساعده في تطوير المواقع الاحترافية وخصوصًا تجربة المستخدم. (مثلاً بأن يكون الكود نظيفًا، ومرتب ومقروء...الخ)، بالإضافة إلى ما هي المعلومات الضرورية التي يجب على كل مطور ويب معرفتها؟

وإذا أنا في بداية الطريق، ما هي الدورات (العربية - الإنجليزية) التي تنصحني بها أخي زكريا؟ خصوصًا إنني أريد تعلم الــAjax، وقيل بأنه من الأفضل تعلم الـDOM والـBOM معًـا قبلها! فهل هذا صحيح؟ أعني هل هذا الترتيب الصحيح للتعلم؟
وإذا كان هنالك نصائح أخرى أخي العزيز أتمنى أن تشرحها أو تدلني على دورات ومواقع استفدت أنت منها.
وجزاك الله خير.
شكراً لك.

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0
بتاريخ 4 ساعات قال zakariamouhid:

إذا كنت في بداية التعلم أنصحك بمتابعة دروس قناة الزيرو ستجد دروس BOM ثم DOM

بعدها إذا أردت تعلم تقنية Ajax ستجدها في قناة الأستاذ عبد الله عيد

وأنصحك دائما إذا واجهت مشكلة أو دالة لم تجدها في JavaScript إبحث أولا في Google

ستجد في الغالب الحل في stackoverflow.com أو developer.mozilla.org

وبعد أن تتعلم ما سبق أنصحك بتعلم البرمجة الكائنية ستجد لها شرحا على هذه القناة

شكراً لك أخي @zakariamouhid، فعلاً أنا في بداية الطريق وشكراً على النصائح القيّمة.
 

لدي سؤال آخر بسيط: ما هي التطبيقات المناسبة التي يجب أو يفضل على الشخص المبتدئ تعلمها قبل أن يصل لمرحلة متقدمة؟
مثلاً: آلة حاسبة عن طريق جفاسكربت؟ -- برنامج لرفع الصور وقصّها بنسبة معينة؟ -- لعبة بسيطة تعتمد على الCookies في تخزين نقاط اللاعب بحيث يستطيع اللعب بها حتى ولو أغلق جهازه وفتحه بعد زمن آخر؟ -- أي تطبيقات أخرى مفيدة؟ ((هل لك موقع أو مدونة أو قناة خاصة أخي زكريا؟)).
وشكراً :)

 

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

جميع التطبيقات مناسبة للتعلم، أي فكرة في دماغك جرب برمجتها بلغة JavaScript

(( هذا موقعي http://zakariamouhid.blogspot.com كنت أضع فيه تطبيقاتي ))

1 شخص أعجب بهذا

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة

يجب أن تكون عضوًا لدينا لتتمكّن من التعليق

انشاء حساب جديد

يستغرق التسجيل بضع ثوان فقط


سجّل حسابًا جديدًا

تسجيل الدخول

تملك حسابا مسجّلا بالفعل؟


سجّل دخولك الآن