فصل flexBox خلاصه قسمت های 2 تا 6

پرسیده شده
فعالیت 1341 روز پیش
دیده شده 583 بار
4

سلام دوستان خلاصه مطالبی که استاد توی این جلسه گفتن رو قرار دادم اگه مطلب اضافه تری رو دارین که بنده جا انداختم

لطفا اضافه کنید

 

order : به معنی سفارش هستش یعنی بیایم و جاهای فرزندان رو   با هم دیگه عوض بکنیم  برای مثلا اگر پرنت ما دارای 4 فرزند می باشد و ما برای فرزند اول میایم و مقدار عددی 4 میزاریم فرزند اول میاد و جای فرزن 4 ام را میگیریم و بقیه فرزند ها یک خانه به سمت چپ می روند به اینصورت عددی 

1  2  3  4 

2  3  4  1

 

flex-grow : یعنی رشد کردن که یکی از پراپرتی ها برای فرزندان هستش  که برای مقدار  بزرگ شدن بر مبنای فضای خالی موجود در پرنت اش میاد و تصمیم میگیرد یک جور  جایگزین برای دادن عرض های درصدی هستش 

 

flex-shrink : یعنی کوچک شدن که یکی از پراپرتی ها برای فرزندان هستش زمانی که عرض container  پدر دیگه نمیتونه بیاد و طوری رعایت کنه که فرزندان عرض ثابت خودشونو رعایت کنند و فرزندان کوچک شوند بیا  و اون فرزندی که این پراپرتی داره متناسب با مقدارش عرض اش رو تغیر بده تا فرزندان همچنان عرض ثابت خودشونو  حفظ کنند 

 

flex-basis : یعنی پایه و اساس ی موقعی هست ما میخواهیم مقدار عرض یک عنصر رو بیایم و با فلکس مقدار دهیش بکنیم برای همین میایم و از این پراپرتی  استفاده میکنیم 

 

flex : برای خلاصه نویسی پراپرتی های دیگر کاربرد دارد که  مقدار اولی که میگیرد برابر flex-grow  مقدار دوم flex-shrink  و مقدار سوم برابر flex-basis  هستش 

 

align-self : برای کنترل align اون آیتم مورد نظر ما که برای  خودش بیاد و تصمیم بگیرد 

 

نکته : یک موقع هست ما موقعی که میخاهیم بیایم و از flex استفاده کنیم بیشتر هدفمون گرفتن عرض هستش برای همین میتوانیم با مقادیر درصدی مشخص کنیم که چن درصد از محتوای پدرشو بیاد و پر کنه 

فایل پیوست

emad ta
emad ta

8 شهریور 99