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

امیرحسین نائی | نائی وب

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

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

تو این پست میخوام آموزش بدم که چطور بک گراند یا همون پس زمینه یه صفحه رو ثابت کنیم تا وقتی صفحه اسکرول میشه حرکت نکنه !
خب ، اول با کد های 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

مدیر سایت

امیرحسین نائی | نائی وب

امیرحسین نائی هستم .
متولد سال 1379 ، عاشق برنامه نویسی ، مخصوصا اندروید و وب :)
مشتاق برای یادگیری بیشتر ...
خستگی ناپذیر و بدون توقف !!! (بیشتر ...)

نظرات

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

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

ارسال نظر

account_circle
mail
security
متن نظر :