CSS পাঠ্য রঙ(CSS Text color) [বাংলায় CSS মাস্টার ক্লাস]

CSS পাঠ্য রঙ(CSS Text color) [বাংলায় CSS মাস্টার ক্লাস]: CSS (ক্যাসকেডিং স্টাইল শীট) ওয়েব ডেভেলপারদেরকে একটি ওয়েবসাইটের রঙ প্যালেটকে সতর্কতার সাথে কিউরেট করার ক্ষমতা দেয়, যাতে অভিব্যক্তিপূর্ণ, পঠনযোগ্য এবং আকর্ষক বিষয়বস্তু তৈরি করা যায়। CSS টেক্সট কালার প্রপার্টি হল একটি অত্যাবশ্যক টুল যা ওয়েব পেজগুলির ভিজ্যুয়াল আবেদন জানাতে কেন্দ্রীয় ভূমিকা পালন করে।

টেক্সট রঙ আবেগ প্রকাশ করার জন্য এবং একটি ওয়েবপৃষ্ঠার টোন সেট করার জন্য একটি শক্তিশালী মাধ্যম। লাল বা কমলার মতো উষ্ণ, প্রাণবন্ত রঙগুলি উত্তেজনা এবং জরুরিতা জাগাতে পারে, যখন নীল বা সবুজের মতো শীতল রঙগুলি প্রায়শই প্রশান্তি এবং বিশ্বাস জাগায়।
নান্দনিকতার বাইরে, পাঠ্যের রঙ সরাসরি পাঠযোগ্যতাকে প্রভাবিত করে। বিষয়বস্তু সহজে সুস্পষ্ট হয় তা নিশ্চিত করার জন্য ব্যাকগ্রাউন্ডের সাথে কার্যকরীভাবে বৈপরীত্যের একটি পাঠ্যের রঙ নির্বাচন করা অপরিহার্য। ব্যবহারকারীর অ্যাক্সেসযোগ্যতা এবং সামগ্রিক ব্যবহারকারীর অভিজ্ঞতার জন্য সঠিক বৈসাদৃশ্য অত্যন্ত গুরুত্বপূর্ণ।
প্রতিক্রিয়াশীল ওয়েব ডিজাইন বিবেচনা করার সময়, পাঠ্যের রঙ বিভিন্ন স্ক্রীনের আকার এবং অভিযোজনের সাথে নির্বিঘ্নে মানিয়ে নেওয়া উচিত। টেক্সট রঙের মানগুলির জন্য আপেক্ষিক একক, যেমন শতাংশ, ব্যবহার করা নিশ্চিত করে যে নকশাটি বিভিন্ন ডিভাইসে দৃশ্যত আকর্ষণীয় থাকে।
ব্যবহারকারীর ইন্টারঅ্যাকশনের সময় ভিজ্যুয়াল ফিডব্যাক দিতে CSS টেক্সট কালার প্রায়ই ব্যবহার করা হয়। উদাহরণস্বরূপ, হোভার বা ক্লিকে পাঠ্যের রঙ পরিবর্তন করা লিঙ্ক বা বোতামের মতো ইন্টারেক্টিভ উপাদানগুলিকে হাইলাইট করে ব্যবহারকারীর অভিজ্ঞতা বাড়াতে পারে।

CSS পাঠ্য রঙ(CSS Text color) [বাংলায় CSS মাস্টার ক্লাস] সম্পর্কে বিস্তারিত নিচে দেওয়া হল।

Example:

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>CSS MASTER JHUTANDA</title>
    <!--https://jhutanda.com-->
    <!--https://github.com/jhutanda-->
</head>

<body>
    <h1>hedding 1</h1>
    <h2>hedding 2</h2>
    <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Magni asperiores corporis ex in vel tempora reiciendis
        animi sint ratione ab!</p>
    <h3>hedding 3</h3>
    <p>Lorem ipsum, dolor sit amet <span>span color</span>consectetur adipisicing elit. Possimus aliquam omnis illo eos aperiam perferendis
        exercitationem ullam! Laborum, harum non.</p>


    <!-- css style -->
    <style>
        h1 {
            color: red;
        }

        h2 {
            color: gold;
        }

        h3 {
            color: magenta;
        }

        p {
            color: blue;
        }
        span{
            color: aqua;
            background-color: yellow;
        }

        body {
            height: 300px;
            width: 400px;
            padding: 10px;
            border: 1px solid green;
        }
    </style>
</body>

</html>

Scroll to Top