💻 آخرین فرصت یادگیری برنامه‌نویسی با آفر ویژه قبل از افزایش قیمت در ۵ آذر ماه (🎁 به همراه یک هدیه ارزشمند )
۰ ثانیه
۰ دقیقه
۰ ساعت
۱ emad ta
فصل css3 خلاصه مطالب جلسه 6- کار با پس زمینه ( background ) در css
جامعه Html & CSS ایجاد شده در ۱۱ خرداد ۱۳۹۹

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

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

 

معرفی پراپرتی های 

 

background-color   :  برای دادن رنگ به پس زمینه المان هامون استفاده میکنیم

background-image  : برای دادن یک تصویر به عنوان پس زمینه به المان هامون میایم و استفاده میکنیم

background-repeat :  تکرار شدن  اون پس زمینه ای که داریم رو میاد و انجام میدهد که مقدار‌های repeat و no-repeat و repeat - y و repeat - x رو میگیرد 

background-position میاد و موقعیت قرار گیری  پس زمینه ما رو مشخص میکند که به طور پیش فرض سمت چپ هست  و میتوانیم به آن مقدار‌های بالا پایین راست و چپ و وسط  هم بدهیم همچنین ما میتوانیم به آن دو مقدار رو هم بیایم و بدهیم 

 

background-attachment : میاد و تصویر ما رو برای پس زمینه فیکس و ثابت اش میکنه  و برای یک سبک از طراحی به نام پارالکس از  این استفاده میکنیم برای ثابت بودنه باید مقدار fixed رو بهش بدهیم

 

نکته : زمانی که ما برای یک عنصر در یک فایل css میایم و background رو در نظر میگیریم باید برای اون یک ارتفاع رو هم در نظر بگیریم همچنین برای این که این عکس بیاد و تمام عرض مارو بپوشنه باید از پراپرتی زیر با مقدار زیر استفاده بکنیم background-size: cover که از تکرار جلو گیری میکنه 

 

background-clip : میاد و محدوده ی باکس مارو درست میکنه که مقدار border-box اون به طور پیش فرض هست که میگه محدوده تو همون بوردر تو هست اگه میایم و مقدار padding-box قرار دهیم میاد و محدوده باکس مارو padding اش قرار میدهد  و مقدار content-box میاد و در جایی که محتوا شروع میشه رو محدوده باکس ما اعمال میکنه

 

نکته  : اگر خواستیم برای یک المان بیایم و هم یک رنگ و یک تصویر رو به عنوان پس زمینه بهش اعمال کنیم برای خلاصه نویسی بهتر از پراپرتی background استفاده میکنیم به طوری که مقدار اول رنگ اون و مقدار دوم تصویر میاد و قرار میگیرد و مقدار بعدی تکرار پذیری اون و مقدار بعدی پوزیشن یا موقعیت اون هست  

 

 

 

 

چرا تغییرات در وب انجام نمیشود با توجه به دستوری که دادم

فرناز سجادیان ۰۶ بهمن ۱۳۹۹، ۱۷:۵۴