Chrome DevTools বিভিন্ন ভিজ্যুয়ালাইজেশন বিকল্পের সাথে ডিবাগিং CSS গ্রিড লেআউটগুলিকে স্বজ্ঞাত করে তোলে।
কীভাবে এলিমেন্টস প্যানেলে গ্রিড ওভারলে টগল করতে হয় এবং এটি ব্যবহার করতে হয় তা জানতে ভিডিওটি দেখুন:
- গ্রিড লেআউটগুলি ভিজ্যুয়ালাইজ করুন এবং পরিদর্শন করুন।
- গ্রিড আইটেম স্থাপন করার সময় উল্লেখ করার জন্য সারি এবং কলাম নম্বর দেখুন।
- লাইন এবং এলাকার নাম ব্যবহার করুন এবং আপনার যদি প্রচুর গ্রিড আইটেম থাকে এবং সংখ্যাগুলি বিভ্রান্তিকর হয় তবে ওভারলেতে সেগুলি দেখুন।
- ট্র্যাক মাপ পরীক্ষা করুন.
অতিরিক্তভাবে, এলিমেন্টস > স্টাইল প্যানে গ্রিড এডিটরের সাহায্যে, আপনি CSS নিয়ম টাইপ করার পরিবর্তে একটি বোতামে ক্লিক করে একটি গ্রিড লেআউটে আইটেম এবং তাদের বিষয়বস্তু সারিবদ্ধ করতে পারেন।
আরও হাতে-কলমে শেখার অভিজ্ঞতার জন্য, CSS গ্রিড পরিদর্শন টিউটোরিয়াল অনুসরণ করুন।