HomeОбразованиеRelated VideosMore From: Elzero Web School

Learn Css in Arabic #14 - Dimensions - Width / Height

1003 ratings | 61114 views
Learn everything about elements dimensions and properties Width Height Min-Width Min-Height Max-Width Max-Height
Html code for embedding videos on your blog
Text Comments (104)
Mr Carrot (3 days ago)
انا مش فاهم ليه العرض متكتبش في الجسم و كان بياخد العرض كله مجرد انه اتكتب في الكلاس على عكس الطول و شكراا مقدما الله يجزيك خيرا
esam sami (2 months ago)
جزاك الله كل خير <3
Hajar El (3 months ago)
Thank u bro Osama
Eyad Mohammd (4 months ago)
الله يعطيك العافية جد انك فناااان سؤالي الك بعد ما اخلص ال css شو ابلش java script ولا bootstrap ولا jqueery
cool
Ahmed Sersawy (7 months ago)
انا مش يتاع تطبيل بس انتا بجد ابدعت في الدرس ده يا هندسة ربنا يا يجزيك خير يارب❤
ذات الأثر (7 months ago)
يا بشمهندس فيه برامج نطبق عليها او مثلا تمارين لتصاميم نعملها عيزه اختبر قدراتي
Mano Ahmed (8 months ago)
ربنا يرزقك من كل حاجه انت بتتمناها انت فعلا بتتعب علشان تعلم الناس
salah mohamed (9 months ago)
https://codepen.io/salah-muhammed/pen/EpJMBp رأيك لو سمحت في التصميم بعد ما خلصت كورس الhtml ووصلت للدرس دا في الcss
Ahmed Mostafa (6 months ago)
salah mohamed جميل جدا
ahmad ahmed (9 months ago)
بتعرف يا م.أسامة انو شرحك أكثر من رائع ..؟ لأنه تفصيلي ملم + انك تكثر من الأمثلة العملية وهذا شيء تفاعلي مع المتدرب ..أحلى مبرمج محترف عرفتو لحد هلق ..الله يوفقك .😍
Elzero Web School (9 months ago)
حبيبي تسلم
Mohamed Shaban (9 months ago)
ممكن لو سمحت اعرف مقاسات Width , Height الخاصه بالصفحه علشان احسب تصميمى وشـــــــــــــكرا
Mohamed Elsafy (9 months ago)
طب ازاي اخلي طول اول عرض الdiv علي قد الكلام بالظبط......وازاي اصغر ملاث حجم الصورة وانا محافظ علي النسب مابين ابعاداها....ولا ده لسه هيتشرح بعدين؟....والشرح جميل جدا
Ahmed Ghonim (10 months ago)
ربنا يبارك لك فعلا انت بتعمل مجهود خرافي عمري ما كنت بثق في اي محنوى عربي بس انت من الحجات الجباره فعلا كان عندي سوال في لا width ازاي اخلي الباك جراويند يجي على قد الكلام زي ال button يعني انا عوزه يبقا اتومتك مع الكلام يزيد وينقص معه وشكرا مقدما
girgis adel (11 months ago)
يعني ايه ان الbody يبقي له height؟ مش الbody بيطوَل حسب المحتوي اللي موجود
Ahmed Ashour (11 months ago)
كل الكلام ال في الدنيا ميكفيش وصفك ...بس حقيقي انت عظيم وشرف ليا ان انت مصري وفي يوم من الايام هكون زيك .....تحيه من طالب حاسباتي عنده طموح ^_^
Elzero Web School (11 months ago)
الله يكرمك يارب ويحفظك تسلم يارب حبيبي
الفجر الباسم (11 months ago)
شكرا جزيلا يا استاذ على الشرح الاكثر من رائع , لكن ماقلته عن استخدامات max-width لجعل الصورة بالحجم المطوب وحتى لاتخرج مثلا عن div لم يزبط معي
Mahmoud Ahmed (1 year ago)
تطبيقي https://codepen.io/mahmoud-abo-anas/pen/wmOKRz
#Yagami For all# (1 year ago)
أنت رزق يمشي فوق الأرض
ِahmed issa (1 year ago)
استاذ كيف ممكن يكون ارتفاع ال body دائما 100% ؟
mostafa ezz (1 year ago)
لو سمحت انا عايز اعرف اعمل (div)و(div) جنب بعض ازاى ؟
Elzero Web School (1 year ago)
عن طريق Float
Suliman Algabarty (1 year ago)
الله يسعدك
Khalid Moutawkil (1 year ago)
thank you very much basha i like your explain and i hope to get a tutorial for angular
o Lakbiri o Brahim o (1 year ago)
شكرا لك يا أستاذي أسامة على دروسك القيّمة، المرجوا منك أن توضح لي هذه المسألة : <div> HTML </div><br> <button> HTML </button> <p> HTML </p> --------------------------------- }div ;min-width:200px ;background-color: powderblue } }button ;min-width:200px ; background-color: powderblue } }p ; min-width:200px ; background-color: powderblue } تم تحديد ال width ل button ولكن div و p لم يأخذا قيمة width التي حددتها.
Elzero Web School (1 year ago)
ضع الكود هنا علشان يكون واضح في التعديل وحل لمشكل codepen.io
BOBO2539 (1 year ago)
الكلمه الطويله مش بتنزل في سطر تاني وبتخرج عن الديف او الزر في حل استخدمت min& max width ليه ؟
unknown (1 year ago)
word-wrap: break-word
Mahmoud Osman (1 year ago)
نفس الكلام عندي و برضه مش عارف ليه
Mamoun Adil (1 year ago)
الله يفتح عليك ي أستاذنا
mohammad al-hassan (1 year ago)
جزاك الله خير وفتح عليك وزادك علما وبارك لك فى علمك وعملك وولدك وعمرك ويعطيك ما تتمنى ويرزقك رضاه والجنة مع النبيين والصالحين
Elzero Web School (1 year ago)
اللهم امين وياك يارب تسلم
Ahmed Salama (1 year ago)
مش فاهم برضو طب ماانا ممكن استخدم Width and height بي
محترف.كوم (1 year ago)
الـ width و ال، height لهم وظائفهم وهذي لها وظيفتها في حال بدات على برمجة الويب راح تلاحظ في مراحل ان الwidth و الheight لوحدهم ما تمشي معاك...
Ahmed Salama (1 year ago)
ممكن استخدم height و Width بدلا منهم
محترف.كوم (1 year ago)
اذا تقصد الـ min-width او max-height عيد الفيديو ثاني راح تفهم.
Elzero Web School (1 year ago)
وضح استفسارك لاني مش فاهمه
mustafa Ibrahim (1 year ago)
why doesn`t the auto value for height property fill the whole page as in width without setting the height for BODY element?
Elzero Web School (1 year ago)
Auto need a Fixed height Example: 1000px
Akrm Adil (1 year ago)
معنى ال انت قولتو ان min-width ملهاش فائدة بتعمل نفس البتعملو width و max-width
محترف.كوم (1 year ago)
لا فائدتها مرة كثيرة صدقني ما يبان كذا لكن لما تجي تعمل حقيقي راح تواجهك صعوبات وابسط حلولها هي الاشياء البسيطة هذي الي تقول عنها ما منها فائدة مع احترامي...
Ahemd Mahmoud (2 years ago)
جزاك الله كل خير يا رب الصحفه بتاعت style. Css مش شغال عندي بس بيكتب الكود صح ومش بيظهر في index ارجو الرد يا استاذ اسامه شكرا لك
يمكن ده رد متأخر جدا لكن ارجو انه يعيدك للمجال لو خرجت منه . انا كانت عندي نفس المشكله في برامج بتعمل حفظ لملف ال سي اس اس بصيغته فلو كتبته style.css مش حيقراه لانه بالنسباله style.css.css عشان كده اكتبه style بس بدون الصيغه
hoda 2015 (2 years ago)
استاذ اسامه بعد اذنك هو Width و height ينفع نحدد بيها الصور والعناصر
محترف.كوم (1 year ago)
نعم في كل شيء (video -images - div - paragaraph -all items) اي حاجة تقريبا...
Mohammed Zakariia (2 years ago)
انا جربت استخدم white-space:normal عشان اخلي الكلام الي بيطلع برا ميظهرش بس مطلعتش صح ,, ايه المشكلة ؟
Elzero Web School (2 years ago)
اشوف الكود هنا codepen.io
Mohamed Talidi (2 years ago)
مشكوور حبيبي مكشووور كثير كثير كثير الله ينصرك ويخليك
Elzero Web School (2 years ago)
اللهم آمين تسلم وتعيش يارب
Salem Elatar (2 years ago)
لو سمحت ان مش شايف ان ال min ليه لازمة ولا فى العرض والارتفاع او يمكن مش فاهمه اوى مع انى شفت الفيديو مرتين علشان احاول افهم
Salem Elatar (2 years ago)
شكرا لحضرتك
Elzero Web School (2 years ago)
هسجل فيديو النهاردة عن المين والماكس باذن الله هيوضحلك الامور كاملة
Fares Shawa (2 years ago)
لسلام عليكم أولا احب اشكرك على الشرح الرائع والمفصل عندي سؤال لم افهمه ما الفرق بين width و max-width علما اني استطيع ان اعمل min-width=50px and width=100px بدل ان اعمل min-width=50px and max-width=100px
Elzero Web School (2 years ago)
عليكم السلام هعمل فيديو متقدم عن الفروق بينهم الكاملة باذن الله في خلال يومين عنيا
x-mega -no (2 years ago)
رائع
ميم Teck (2 years ago)
شكراااا على الشرح الرائع الممتاز.. سؤال هل ممكن أن أحدد لعنصر ما max-width دون تحديد min-width؟
Elzero Web School (2 years ago)
ممكن عادي جدا لانه لا يشترط وجود ارتفاع معين تبدا بيه لكن ممكن اقولوا اول متوصل ارتفاع معين خلاص اقف
ميم Teck (2 years ago)
كما نصحت أحد الإخوة لقد جربت في موقع codepen نعم ممكن تحديد max-width دون تحديد min-width شكرا مرة أخرى على مجهوداتك الرائعة وجزاك الله عنا كل خير
EnGineEra Radwa (2 years ago)
عندي سؤال ويارب ترد عليا بقي ليه حضرتك حددت الbody height بالpx مش يال % وانا لما جربت احددها بال 100 % واديت الchild كمان بالنسبه مئويه منفعتش ليه ؟
hassan ashraf (1 year ago)
اخي الكريم % بتخلي المساحه بالنسبه المئويه من مساحه الصفحه كلها يعني اذا عمل الheight الارتفاع ب% سوف تاخذ الصفحه بطولها كلها لذلك هو وضع المساحه بالبكسل اي بالpx وهذه وحده من وحدات القياس فبهذه الوحده يمكنه تحديد الارتفاع حسب مايريد بدقه و% ايضا يتيح التحديد بدقه ولاكن الفرق هو كانك مثلا تمسك مسطره وتريد تحديد قياس معين علي حسب ما يريد معلمك مثلا فهناك فرق اذا قال لك اجعل القياس 5 سنتيمتر او قال لك اجعل المساحه ربع الصفحه اي 25% فعلامه % اذا تم اضافتها تعني انها ربع الصفحه ولاهناك فرق حتي اذا تم تكبير الصفحه او تصغيرها فتظل المساحه ربع الصفحه او 25% لا تتغيير لاكن 5سنتيمتر تختلف ولاكن لاتختلف في مقاسها بل في ظهورها مثل عند قياسك ل5 سنتيمتر في مثلا كراسه اكيد سوف تراها بوضوح حتي اذا ابتعدت قليلا لاكن اذا تم قياس نفس النسبه من مساحه ارض مثلا زراعيه او ارضيه الغرفه سوف ترى انها صغيرة جدا بالنسبه التي حولها بس كده ده كل الي في الموضوع وارجو اني اكون قد استطعت ان افيدك
ELGENIAS ABDO (2 years ago)
حبيبى الله ينور شرحك على راسى
Abdo Shetewa (2 years ago)
ايه LANG IN ف كود ال HTML
Elzero Web School (2 years ago)
اتريبيوت Lang بتعرف بيه لغة الصفحة
Abdelrahman Hamdy (2 years ago)
طب انا عندى ال max-height مش بتوقف حتا لما بعملها
Elzero Web School (2 years ago)
وريني الكود هنا codepen.io
hema saied (2 years ago)
بحث احيانا ان ال min-width min-height بيستخدموها في الشات زي الفيس والواتس وكدة انا اتاكدت من كدة عن طريق inspect elemenet بس هوا ايه التاج الخاص بالسيرش ؟ زي محركات البحث او البحث عن الفريندز في الفيس و الخ؟ وااااااااا شوقرن !
hema saied (2 years ago)
+Elzero Web School ألف ثانكس يا ريس :3
Elzero Web School (2 years ago)
البحث حقل ادخال عادي اللي بتشوفه فيه دة كله بيعتمد على الشغل اللي بيحصل في ال Backend وغالبا معظمه Ajax يعني الحقل مش هو البنية الاساسية للي انت بتشوفه دة
Aser Syria (2 years ago)
استاذ اسامة هلأ في باالارتفاع div عندي بالتصميم بكل متصفح عم يصير شكل.. يعني فارق شي 20px بين بعض.. ياريت تقلي السبب وبينفع تظبط بال max-height
Elzero Web School (2 years ago)
الله يكرمك يارب لو تكتب الكود هنا هشوف واقولك السبب codepen.io لان في height و innerHeight
Mohamed El Sayed (2 years ago)
هو حضرتك ليه لما جيت تعمل ال min-width للديف مرضاش يتعمل معاك علشان كده حضرتك عملت زرار ال button وكملت المثال عليه ؟؟؟
Mohamed El Sayed (2 years ago)
تمام الف شكر يا هندسه
Elzero Web School (2 years ago)
شوف انت بتقولوا اقل عرض للديف 10 لكن هو هيعدي المساحة دي عادي مادام في فراغ قدامه لكن اعمل الاب بتاعه العرض بتاعه عشرة وشوف هتفهم http://codepen.io/OsamaElzero/pen/dXperx
Mohamed El Sayed (2 years ago)
فى الدقيقه 3:40 لما عملن ال min-width 10px الديف متعملش 10px
Elzero Web School (2 years ago)
في الدقيقة الكام الله يكرمك ؟
Khaled Mohamed (2 years ago)
شرح ممتاز بجد بس عندى سوال هل قيمه max-width تقدر تتجاوز قيمه width يعنى لو قيمه width تساوى 100% وقيمه max-width تساوى 150% ايهما هينفذ ويطبق 150 ولا 100 السوال ده محيرنى جدااااااااااااا
Elzero Web School (2 years ago)
معلش انا اقدر اجاوبك على سؤالك لكن مادام دخلت عالم الكمبيوتر و الويب لازم تتعلم تجرب كل حاجة بنفسك خلي الاسئلة للحاجات اللي مش فاهمها او مش عارف وظيفتها او مش منطقية بالنسبة ليك جرب هنا codepen.io و اكتب النتايج وشوف
Coder _1 (3 years ago)
السلام عليكم ورحمة الله وبركاته .. استاذ اسامة شرحك راائع ومفهوم جميل جداً لكن انا احترت في حاجة معينة وهي بخصوص وسم ال (button) فأنا اكملت كورس ال (html) ولم ار هذا الوسم اما الان رأيته ، هل ممكن ان هذا يعني انه هذا الوسم بلا فائدة ؟ ام انك نسيته سهوا ً حفظك الله؟ وشكراً
يعني درس زي ده كدة موجود فيه ال buttom مع انه مش جزء من الدرس
مريم رومى (1 year ago)
قصدك ايه بالدروس التطبيقية؟؟
Elzero Web School (3 years ago)
+‫عبدالرحمن العبدان‬‎ عليكم السلام و الرحمة في عناصر و تاجات كتير بنعملها في الدروس التطبيقية و بنستخدمها كتير جدا يعني لو حاجة ملقتهاش في الكورس هتلاقيها في الدروس التطبيقية
abdulfattah tawil (3 years ago)
جزاك الله خيرا
Omar Charkaoui (3 years ago)
جزاك الله خيرا اللهم جعله في ميزان حسناتك
Omar M Farhat (3 years ago)
شرح أكثرمن رائع .. سلمت يداك يا بشمنهندس
Elzero Web School (3 years ago)
+Omar M Farhat الله يكرمك يارب و يوفقك تعيش يارب
دائما رائع
Elzero Web School (3 years ago)
+humam huseen الله يرضى عليك يارب
Fire TV (3 years ago)
جزاك الله كل خير
Amiena Mohamed (4 years ago)
جزاك الله خيراً أن شاء الله .. سؤال: 1- دلوقتى حضرتك أستخدم <button> ده برده بينطبق عليه كل ما سبق ذكره من أول دروس الcss بمعنى تغير خلفية لصورة وما شابه؟ 2- ما هو الفرق بين <button> و ال < submit type="button"> ؟ 3- ومتى يمكن أستخدام كل منهما؟ 4- أنا بستخدم النوت باد بلس ممكن حضرتك تقولى ممكن أكبر الفونت اللى بكتب فيه ازاى؟ وشكراً لك
Coder _1 (3 years ago)
+Elzero Web School ايوه فهمت شكرا لحضرتك
Elzero Web School (3 years ago)
+‫عبدالرحمن العبدان‬‎ هي تقصد input type="submit"
Coder _1 (3 years ago)
+Amiena Mohamed ليس هناك وسم اسمه <sumbit> انا رديت عشان اوثق معلوماتي لانه لما شفت ردك انصدمت من فين طلع هذا الوسم الجديد ، بالنسبة للـ sumbit فهي قيمةللسمة type اي ان : <input type="sumbit" value=""z>
Amiena Mohamed (4 years ago)
تسلم يا رب ويرزقك من حيث لا تحتسب بكل ما يرضاه لك أن شاء الله
Elzero Web School (4 years ago)
+Amiena Mohamed عيوني :)
hanTo alhanTo (4 years ago)
جزاك الله خير يابشمهندس اسامه عندي سوال  الديف بعض الاحيان مايقيل العرض والطول  ال css  مربوط بال  html  غيرت خلفية الbody  واتغيرت بس  ال div  ماياخذ الابعاد  وجزاك الله خير
Elzero Web School (4 years ago)
اديني مثال الله يكرمك علشان اعرف السبب و اسف على التاخير الرسالة مشوفتهاش في الميل  codepen.io  نزل المثال هنا علشان اعرفلك المشكلة

Would you like to comment?

Join YouTube for a free account, or sign in if you are already a member.