ওয়েব ডিজাইনে CSS ভেরিয়েবল কিভাবে কাজ করে ?

CSS ভেরিয়েবল আপনাকে CSS কোডের মধ্যে পুনঃব্যবহার যোগ্য মান সংরক্ষণ করতে দেয়। CSS ভেরিয়েবল ব্যবহার করে, আপনি একটি কেন্দ্রীয় স্থানে মান সংরক্ষণ করতে পারবেন এবং আপনার স্টাইলশীটে সেগুলি পুণরায় করতে পারবেন। এতে কোডের স্থায়িত্ব এবং রক্ষণাবেক্ষণ ক্ষমতা বেড়ে যায়।

CSS ভেরিয়েবল তৈরি করার জন্য, ডাবল হাইফেন ( -- ) দিয়ে একটি ভেরিয়েবল নাম শুরু করতে হয় এবং এটি :root সিলেক্টরের মধ্যে সংজ্ঞায়িত করা হয়, যাতে এটি সমস্ত ডকুমেন্টে গ্লোবালি অ্যাক্সেসযোগ্য হয়। উদাহরণ:

:root { --button-color: #3498db; --font-size: 16px; }


এখানে, ভেরিয়েবলের নামকরণে আপনার পছন্দ মতো নাম দিতে পারবেন। এরপর এতে মান সংরক্ষণ করবেন, যা পরবর্তীতে পুণরায় ব্যবহার করা হবে।

CSS এ ব্যবহারের জন্য, ভেরিয়েবলগুলিকে var() ফাংশনের মাধ্যমে ব্যবহার করা যায়। উদাহরণস্বরূপ:

.button { background-color: var(--primary-color); font-size: var(--font-size); color: white; } 



Post a Comment

Previous Post Next Post