CSS পাঠ্য রূপান্তর (Text Transformation) [বাংলায় CSS মাস্টার ক্লাস]: CSS (ক্যাসকেডিং স্টাইল শীট) ওয়েব ডেভেলপারদের টেক্সট নিয়ন্ত্রণ এবং উন্নত করার জন্য একটি সমৃদ্ধ সরঞ্জাম সরবরাহ করে। এই টুলগুলির মধ্যে, CSS টেক্সট ট্রান্সফর্মেশন প্রপার্টি হল একটি গতিশীল বৈশিষ্ট্য যা ডিজাইনারদের টেক্সটের চেহারা পরিবর্তন করার ক্ষমতা দেয়, ওয়েবসাইটের ভিজ্যুয়াল ল্যাঙ্গুয়েজে নতুন মাত্রা যোগ করে।
CSS পাঠ্য রূপান্তর বিভিন্ন উপায়ে পাঠ্য পরিবর্তন করতে সক্ষম করে। এতে টেক্সট-ট্রান্সফর্মের মতো বৈশিষ্ট্য রয়েছে, যা টেক্সটের ক্যাপিটালাইজেশন পরিবর্তন করতে পারে, এটিকে বড় হাতের, ছোট হাতের অক্ষর বা প্রতিটি শব্দের প্রথম অক্ষর বড় হাতের অক্ষর তৈরি করতে পারে। এই রূপান্তরগুলি স্বতন্ত্র চাক্ষুষ উপাদান তৈরির জন্য গুরুত্বপূর্ণ।
CSS পাঠ্য রূপান্তর (Text Transformation) poperty গুলি হলঃ
- uppercase
- lowercase
- capitalize
ধারাবাহিকতা ডিজাইনের একটি মূল দিক। CSS পাঠ্য রূপান্তর ব্যবহার করে, ডিজাইনাররা নিশ্চিত করতে পারেন যে পাঠ্য একটি অভিন্ন শৈলী এবং উপস্থাপনা বজায় রাখে। শিরোনাম বড় করা বা সমস্ত পাঠ্যকে ছোট হাতের তৈরি করা একটি ওয়েবসাইটে একটি সুরেলা এবং পালিশ অনুভূতি যোগ করতে পারে।
টেক্সট ট্রান্সফরমেশন বিভিন্ন স্ক্রীন সাইজ এবং ওরিয়েন্টেশনে নির্বিঘ্নে মানিয়ে নিতে পারে। আপেক্ষিক ইউনিট এবং প্রতিক্রিয়াশীল নকশা কৌশল ব্যবহার করে, পাঠ্য শৈলী বিভিন্ন ডিভাইসে দৃশ্যত আনন্দদায়ক থাকতে পারে।
CSS পাঠ্য রূপান্তর বৈশিষ্ট্যগুলি প্রায়শই ব্যবহারকারীর মিথস্ক্রিয়া চলাকালীন ভিজ্যুয়াল প্রতিক্রিয়া প্রদান করতে ব্যবহৃত হয়। যখন ব্যবহারকারীরা একটি লিঙ্কের উপর হোভার করেন বা ক্লিক করেন, তখন পাঠ্যটি স্টাইল বা চেহারাতে রূপান্তরিত হতে পারে, ব্যবহারকারীর অভিজ্ঞতা বাড়ায়।
CSS পাঠ্য রূপান্তর (Text Transformation) সম্পর্কে বিস্তারিত নিচে দেওয়া হল।
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>this is heading</h1>
<h2>this is heading</h2>
<h3>this is heading</h3>
<h4>this is heading</h4>
<!-- uppercase
lowercase
capitalize -->
<!-- css style -->
<style>
h2 {
text-transform: capitalize;
}
h3 {
text-transform: uppercase;
}
h4 {
text-transform: lowercase;
}
</style>
</body>
</html>