آموزش ساخت عنصر ثابت با css : ما در این مطلب از سایت آی وحید میخواهیم کمی از بحث های آموزش وردپرس دور شویم ، به همین خاطر برای شما آموزش ساخت عنصر ثابت با css آماده کردیم . با استفاده از این آموزش شما میتوانید یک عنصر ثابت رو به وسیله ی کدهای CSS تعریف و در سایتتون قرار بدید . پس با ما در ادامه مطلب برای دیدن آموزش همراه باشید .
آموزش ساخت عنصر ثابت با css
خصوصیت موقعیت در سی اس اس نوع موقعیت یک عنصر HTML در سایت رو تعریف میکنه ، اگر بخواهید موقعیت یک عنصر در صفحه همیشه به صورت ثابت باشه ( حتی در صورت اسکرول کردن ) ، شما میتوانید از یک موقعیت ثابت استفاده کنید .
در این آموزش من این کار رو به شما آموزش میدم :
گام اول : HTML
کد زیر رو به سایتتون اضافه کنید .
<div class="block">
در این قسمت هر متنی که میخواهید در بلاک قرار گیرد را وارد کنید .
</div>ما خودمون برای نمونه متن Lorem Ipsum رو قرار دادیم تا تست رو انجام بدیم .
گام دوم : CSS
کد سی اس اس رو به صورت زیر تعریف کنید :
.block {
position: fixed;
}اگر شما بخواهید میتونید اون رو سفارشی تر کنید ، ما برای تست از کدهای زیر استفاده کرده ایم تا بتونیم بلاک ثابتمون رو به صورت واضح تر به کاربران نمایش بدیم ، کد زیر رو نگاه کنید :
.block {
position: fixed;
background: #2184cd;
color: #fff;
padding: 20px;
width: 400px;
}گام سوم : نتیجه نهایی
ما متن رو قرار دادیم و سایت هم به راحتی اون رو شناسایی کرد ، حتی با اسکرول کردن هم بلاک مربوطه هیچ تغییر موقعیتی نمیده !
تصویر زیر گویای نمونه ی کار ما هست :
شما میتوانید این کد را در هر کجا که خواستید استفاده کنید و از آن لذت ببرید . ما در سایت آی وحید منتظر انتقادات و پیشنهادات شما عزیزان هستیم .
