#43 | شرح display block - inline - inline block

يمكنك مذاكرة درس ال display من هنا من هنا |
nouvil.net/css...
-----------------------------------
للتواصل معي :
instagram |
/ abdelrahman_noufal
-----------------------------------
facebook |
/ abdelrahman.g.nofal
-----------------------------------
جروب الفيسبوك الخاص بنا |
/ 1810581845642171
-----------------------------------
خاصية CSS Display هي إحدى الخصائص الأساسية في CSS التي تسمح للمطورين بتحديد كيفية عرض العناصر في صفحة الويب. تتضمن هذه الخاصية ثلاثة قيم رئيسية هي: block و inline و inline-block.
قيمة Display Block تجعل العنصر يشغل مساحة كاملة في العرض ويبدأ عرضه من سطر جديد، ويمكن للعنصر أن يحتوي على عناصر أخرى داخله. تستخدم قيمة Display Block بشكل رئيسي لإنشاء بنية الصفحة وعرض العناصر الأساسية مثل div وsection وheader وfooter وغيرها.
قيمة Display Inline تجعل العنصر يعرض داخل سطر النص ويقتصر على مساحة المحتوى الذي يحتوي عليه، ولا يمكن للعنصر أن يحتوي على عناصر أخرى داخله. يستخدم عادةً لعرض العناصر النصية مثل الروابط والنصوص والصور.
قيمة Display Inline-block تجعل العنصر يعرض داخل سطر النص ويمكن له أن يحتوي على عناصر أخرى داخله، ولكنه لا يشغل مساحة كاملة في العرض كما في قيمة Display Block. يستخدم عادةً لعرض العناصر النصية التي تحتوي على عناصر أخرى داخلها مثل الأزرار والحاويات.
يمكن استخدام خاصية Display بشكل واسع في تصميم صفحات الويب لتحديد كيفية عرض العناصر وتنظيمها في الصفحة. عند استخدام هذه الخاصية، يجب أن يتم اختيار القيمة المناسبة بناءً على نوع العنصر والتصميم المطلوب. يجب الاهتمام بتنظيم وترتيب العناصر بطريقة مناسبة وجعلها سهلة القراءة والاستخدام للمستخدم.
عند استخدام قيمة Display Block، يجب الانتباه إلى أن العناصر ستشغل مساحة كبيرة في الصفحة، وقد يؤثر ذلك على تنظيم الصفحة وسرعة التحميل. وعند استخدام قيمة Display Inline، يجب الانتباه إلى أن العناصر لن تستطيع أن تحتوي على عناصر داخلها، وقد تؤثر ذلك على التصميم والتنظيم. وعند استخدام قيمة Display Inline-block، يجب الانتباه إلى أن العناصر قد تشغل مساحة كبيرة في الصفحة إذا تم استخدامها بشكل غير مناسب.

[@tiger_Anas]

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

[@BASHERGAMING-gd2jg]

"صغير"صح "سغير"خطا

[@thell8925]

تعلم تكتب عربي بالاول ارجع تعا اتعلم الكورس😂

[@AbdelrahmanGamal]

يا شباب مش مهم الطريقة بيتكتب بيها الكلام المهم اننا فهمنا هو عايز يقول ايه و ده المفيد .

[@3enabe]

​@@AbdelrahmanGamalربنا يباركلك ويرزقك راحة البال

[@OsamaAmeen-re2vy]

يا حبيبي 😊 استمر يا بطل 🔥

[@MohamedAmineZaaraui-ze8do]

بارك الله فيك ❤ شكرااااااااااااااااااااا

[@soulgaming4657]

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

[@elhjbtt7681]

قناة في المستوى الممتاز شكرا...

[@zakiiiofficiel7787]

[@sinwri6213]

درس جميل جداا شكرا لك

[@English_with_raw]

يا عم انت 🇩🇿❤️

[@storiesfromhistory3522]

أنا لم يبقلي وأكمل الكورس ، أردت ان أقل أنه العظيم بكل ماتحميله الكلمة من معنى ، وخصوصا درس سابق animation, برك الله فيك أستاذ وجعلها في مزان حسناتك ، أخوك من الجزائر ❤

[@Codefull1]

عاش يا هندسه 💗💗

[@اناشيددينيه-و3ر]

شرح اكتر من رائع حقيقي شكرا جدا كنت بتلغبط فيهم خالص❤❤❤

[@aepraepr2204]

thank you verry much😊😊

[@mohamedhamada3003]

الله يباركلك يهندسه

[@ihsseneihssene-es5vc]

👏👏👏👏👏👏👏👏👏👏👏

[@أحمدأحمد-ط3ر7ل]

الحلقة رقم ٤٢ مش موجودة

[@AbdelrahmanGamal]

لا موجوده اهي kzbin.info/www/bejne/lavCiIieYqyohq8 و يستحسن تشوف الكورس في قائمة التشغيل عشان تشوفه بشكل مرتب

[@marwamsadek2687]

جزاك ربنا خيرا كثيرا 🌸

[@elmoharbomar4889]

شكرا ليك يا هندسه

[@Mohamedahmed-vj3uk]

Gamed

[@abderrahimlaradji4169]

بارك الله فيك

[@elhjbtt7681]

شرح ممتاز يا استاذ شكرا لكم .المزيد ان شاء الله .انا اتعلم منكم الكثير شكرا مرة اخرى .❤

[@DASDOS]

شكرا اخي الله يوفقك

[@khawlarima4222]

شرح جدا جدا جدا رائع بارك الله فيك

[@reemhimaya8422]

شرحك حلو جدا و ربنا يعزك و ينفع بيك

[@tttf8232]

الله يسعدك شرحك تحفه

[@mohamedsayed3775]

الله ينور ... تسلم

[@MohammadSaoun-d6n]

3aach abdelrahmaan

[@bakirdoudou992]

ربا اشيحفض ا يابا

[@Sidra-nabeel]

أحسن حدد يشرح للأبد 🤍

[@itsme-bu7fi]

شرحك حلو إستمر

[@Amine._126]

شكرآ والله انك أسطورة ال css

[@themask4443]

شكرا

[@عبدالروؤفالمهندس]

بارك الله فيك ،، شرح بسيط و وواضح

[@mariemmohamed-xx3ns]

🖤🖤🖤🖤

[@zainabkhalid8470]

❤❤❤❤❤❤❤😊😊😊

[@webb-developer]

✅

[@WadaqHijazi123]

شرح جدا رائع 🤩🤩🤩

[@gameapk46533]

❤❤❤❤❤

[@khaledAhmed-eb4be]

Thanks

[@theKing-fj7pq]

gg

[@اكاديميةقلعةالعلمالعالمية]

good job