امیرحسین نائی | امیر اچ ان

پس زمینه (بک گراند) ثابت

پس زمینه (بک گراند) ثابت

تو این پست میخوام آموزش بدم که چطور بک گراند یا همون پس زمینه یه صفحه رو ثابت کنیم تا وقتی صفحه اسکرول میشه حرکت نکنه !
خب ، اول با کد های css یه بک گراند ساده برای صفحه در نظر میگیرم و چند فاصله خطی هم برای اینکه صفحه قابل اسکرول باشه ایجاد میکنم:

	
<style>
body {
	background-image:url('https://naeiweb.com/image/logo.png');
	background-repeat:no-repeat;
}
</style>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
finish .
	

حالا برای اینکه بک گراند ثابت بشه ، کد های css رو بصورت زیر تغییر میدم :

	
<style>
body {
	background-image:url('https://naeiweb.com/image/logo.png');
	background-repeat:no-repeat;
	background-attachment:fixed;
}
</style>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
finish .
	

توی کد بالا فقط خط زیر اضافه شد و همین خط باعث ثابت شدن بک گراند شد :

	
background-attachment:fixed;
	

تاریح ارسال/ویرایش پست : 6/7/1395

مدیر سایت

امیرحسین نائی | امیر اچ ان

امیرحسین نائی (amirhn - امیر اچ ان) هستم.
متولد 1379 عاشق❤️ برنامه نویسی با انواع زبان های مختلف 😃
از 15 سالگی یادگیری برنامه نویسی رو شروع کردم
و تا امروز همچنان درحال یادگیری هستم .
در تلاش برای تبدیل شدن به یک Full Stack Developer 💪
روز به روز بیشتر عاشق برنامه نویسی میشم و هرگز برام خسته کننده نمیشه !!!

نظرات

نظرات محمد حسین

دمتون گرم و دستتون طلا. عالی بود.

ارسال نظر

account_circle
mail
security
متن نظر :