এই বছর CSS দিবস সম্মেলনে Chrome টিমের উপস্থিতি ছিল ব্যাপক। আমরা CSS হেল্পডেস্ক পরিচালনা করে অংশগ্রহণকারীদের প্রশ্নের উত্তর দিয়েছিলাম, কিন্তু একটি হোয়াইটবোর্ডও ছিল যেখানে আমরা লোকেদের জিজ্ঞাসা করেছিলাম যে CSS থেকে এখনও কী অনুপস্থিত। এই পোস্টে আমি সেই প্রশ্ন জিজ্ঞাসা করার ফলাফলগুলি শেয়ার করব, এবং এই সংক্ষিপ্ত জরিপটি সম্পূর্ণ করে HTML এবং CSS থেকে কী অনুপস্থিত বলে আপনি মনে করেন তা আমাদের জানাতে বলব। আপনি কি CSS দিবসের অংশগ্রহণকারীদের সাথে একমত?
শীর্ষ দশটি অনুরোধ
অংশগ্রহণকারীদের স্টিকি নোটে ধারণাগুলি লিখে বোর্ডে যুক্ত করতে বলা হয়েছিল। লোকেরা একটি স্টিকার যুক্ত করে ধারণাগুলিতে তাদের ভোটও যোগ করতে পারত। শীর্ষ দশটি বৈশিষ্ট্য নিম্নরূপ।
স্টাইলিং ইনপুটগুলির জন্য সমর্থন
এটি ছিল আমাদের সেরা ফিচার অনুরোধ, যেখানে ২১টি ভোট পেয়েছে। আপনি সত্যিই এই সাধারণ UI উপাদানগুলিকে একটি ধারাবাহিক উপায়ে স্টাইল করার উপায় চান।
Chrome-এ আমরা এই বিষয়টি সম্পর্কে ভালোভাবেই অবগত, কারণ এটি ডেভেলপারদের জন্য একটি প্রধান সমস্যা, এবং ডেভেলপারদের জন্য আরও ভালো সমাধান তৈরির জন্য কাজ চলছে। উদাহরণস্বরূপ, কাস্টমাইজেবল সিলেক্ট এলিমেন্টের লক্ষ্য হল নতুন স্টাইলিং আচরণ বেছে নেওয়ার একটি উপায় প্রদান করা। এরপর আপনি ছবি যোগ করতে পারেন অথবা বিকল্পগুলিতে আরও বিস্তৃত স্টাইলিং করতে পারেন। এই পদ্ধতির সুবিধা হল এটি একটি নিয়মিত সিলেক্ট মেনুতে ফিরে যাবে, যা এটিকে একটি প্রগতিশীল বর্ধন হিসেবে অনুমোদন করবে।
দৃশ্যত লুকানো
CSS দিবসে ১৯টি ভোট পেয়ে, এটি ছিল দ্বিতীয় সর্বাধিক জনপ্রিয় অনুরোধ। অনুরোধটি কেবল স্ক্রিন রিডারদের দ্বারা ব্যবহৃত সামগ্রী যুক্ত করার একটি উপায়ের জন্য। এটি একটি HTML উপাদান হতে পারে, যেখানে সামগ্রীটি প্রদর্শিত হয় না এবং কেবল স্ক্রিন রিডার দ্বারা পড়া হয়।
সাধারণত আজকাল লোকেরা বিষয়বস্তু লুকানোর জন্য একটি .visually-hidden ক্লাস তৈরি করে এটি অর্জন করে, কিন্তু তবুও এটি স্ক্রিন রিডারদের কাছে অ্যাক্সেসযোগ্য করে তোলে।
যদিও এটি একটি জনপ্রিয় অনুরোধ, তবুও এমন কিছু লোক আছেন যারা মনে করেন না যে এটি বাস্তবায়ন করা উচিত। বিস্তারিত জানার জন্য পড়ুন ভিজ্যুয়াললি হিডেন কন্টেন্ট একটি হ্যাক যা সমাধান করা দরকার, অন্তর্ভুক্ত নয় এবং CSS WG ইস্যু 560 এর উপর এই আলোচনা।
অবস্থান: ভিতরে স্টিকি ওভারফ্লো: লুকানো
এই অনুরোধটি ১৬টি ভোট পেয়েছে। বর্তমানে, position: sticky শুধুমাত্র তখনই কাজ করে যখন সমস্ত অভিভাবক overflow: visible ।
২০১৭ সাল থেকে এটির জন্য একটি উন্মুক্ত সমস্যা রয়েছে, এবং যদিও overflow: hidden for clearing floats ব্যবহার সক্ষম করার প্রাথমিক ব্যবহারের ক্ষেত্রে আজ কম প্রয়োজন হতে পারে, থ্রেডে আরও অনেক পরিস্থিতির বিস্তারিত বর্ণনা রয়েছে।
height: auto
১২টি ভোটের মধ্যে, অনেক অংশগ্রহণকারী height: auto তে অ্যানিমেট করতে চেয়েছিলেন। আমরা আনন্দের সাথে বলতে পারছি যে এটি ওয়েব প্ল্যাটফর্মে CSS interpolate-size প্রপার্টি এবং calc-size() ফাংশন সহ আসছে। এগুলি Chrome 129 থেকে পাওয়া যাবে। ভবিষ্যতে এই বিষয়ে আরও তথ্য সহ একটি পোস্টের জন্য অপেক্ষা করুন।
অতিরিক্ত ইনপুট প্রকার
HTML5 আপনার জন্য <input> এলিমেন্টের জন্য অনেক ধরণের বিকল্প এনেছে — উদাহরণস্বরূপ, ইমেল ঠিকানার জন্য type="email" অথবা রেঞ্জ স্লাইডারের জন্য type="range" । CSS Day-তে আমরা এই ধরণের আরও বিকল্পের জন্য ১০টি ভোট পেয়েছি, উদাহরণস্বরূপ, ডাবল রেঞ্জ, অথবা কাস্টম ডেটালিস্ট সহ অটোকম্পলিট।
CSS-এ বাস্তব এলোমেলো সংখ্যা
CSS-এ আসল র্যান্ডম সংখ্যার জন্য ১০টি ভোটের আরেকটি অনুরোধ ছিল। অতীতে র্যান্ডম অ্যানিমেশন-সময়কালের জন্য এটি অনুরোধ করা হয়েছে এবং কাজ করা হয়েছে।
মিক্সিন স্টাইল ক্লাস
সিএসএস প্রিপ্রসেসরগুলিতে পূর্বে দেখা যাওয়া বেশ কিছু বৈশিষ্ট্য যুক্ত করেছে—কাস্টম বৈশিষ্ট্য সহ ভেরিয়েবল, এবং এখন সিএসএস নেস্টিং। তবে, পুনঃব্যবহারযোগ্য মিক্সিনগুলি এখনও ভাষার অংশ হয়ে ওঠেনি, তবে সিএসএস দিবসের অংশগ্রহণকারীদের মধ্যে সাতজন সেগুলি দেখতে আগ্রহী ছিলেন।
এই বৈশিষ্ট্যটির জন্য একটি স্পেসিফিকেশন তৈরির জন্য একটি CSS ওয়ার্কিং গ্রুপ রেজোলিউশন হয়েছে, এবং আপনি সেই সংখ্যার আলোচনায় আপনার চিন্তাভাবনা এবং ব্যবহারের উদাহরণ যোগ করতে পারেন।
ছায়া DOM-এ গ্লোবাল স্টাইল
আরেকটি বিষয় যা ব্যবহারের ক্ষেত্রে ব্যাপক আলোচনার বিষয় তা হল একটি ছায়া DOM-এর ভিতরে গ্লোবাল CSS স্টাইল প্রয়োগের অনুমতি দেওয়ার অনুরোধ, CSS Day-তে ছয়জন ব্যক্তি এটির জন্য অনুরোধ করেছিলেন। এই ক্ষমতাটি ওয়েব উপাদানগুলিতেও গ্লোবাল রিসেট স্টাইল প্রয়োগ করার অনুমতি দেবে এবং একটি সাইটের সমস্ত উপাদান জুড়ে একক CSS ফাইল কাজ করবে। ব্যবহারের ক্ষেত্রে এই সারাংশটি একবার দেখুন, এবং এটি এমন একটি বৈশিষ্ট্য কিনা তা আমাদের জানান যা আপনিও পেতে চান।
মিশ্র এককের বিভাজন
ইন্টারপ ২০২৪-এর জন্য একটি প্রস্তাব ছিল যেখানে মিশ্র একক দ্বারা ভাগ করার ক্ষমতার অনুরোধ করা হয়েছিল—উদাহরণস্বরূপ calc(100vw / 1px) । ইন্টারপ ২০২৪-এর জন্য এটিকে খুব বিস্তৃত বলে মনে করা হয়েছিল, তবে অনেক ডেভেলপার, যার মধ্যে CSS দিবসে ছয়জন ব্যক্তিও ছিলেন, এটি বাস্তবায়িত দেখতে চান।
nth-letter
CSS-এ বেশ কিছু ছদ্ম-উপাদান রয়েছে যা এমনভাবে কাজ করে যেন আপনি কন্টেন্টের কোনও অংশের চারপাশে একটি স্প্যান মোড়ানো আছে। উদাহরণস্বরূপ, ::first-letter ছদ্ম-উপাদানটি ব্লক কন্টেইনারের প্রথম লাইনের প্রথম অক্ষরকে লক্ষ্য করে যেটিতে এটি প্রয়োগ করা হয়েছে।
সেই তালিকা থেকে বাদ পড়েছে ::nth-letter , এবং আপনি প্রায় বিশ বছর ধরে ::nth-letter চাইছেন, তাই আমরা জানি এটি ওয়েব ডেভেলপারদের কাছ থেকে দীর্ঘদিনের অনুরোধ। CSS দিবসে ছয়জন লোক এটির পক্ষে ভোট দিয়েছে, যা এটিকে আমাদের সেরা দশটি কাঙ্ক্ষিত বৈশিষ্ট্যের মধ্যে শেষ করে তুলেছে।
আপনি কি সিএসএস দিবসের সেরা দশের সাথে একমত?
আমরা এই বিষয়গুলি সম্পর্কে আরও বিস্তৃত পাঠকদের কাছ থেকে শুনতে আগ্রহী, এর মধ্যে কোনটি কি আপনার সেরা দশে স্থান করে নিয়েছে? যদি না হয়, তাহলে CSS এবং HTML-এ অন্য কিছু দেখতে আপনার ভালো লাগবে কি? এই সংক্ষিপ্ত ফর্মটি পূরণ করে আমাদের জানান এবং আমরা অন্য একটি পোস্টে উত্তরগুলি সংক্ষেপে প্রকাশ করব।