CSS Inspector টুলটি হল একটি শক্তিশালী ডেভলপার টুল যা আপনাকে যেকোনো এলিমেন্টের সমস্ত CSS বৈশিষ্ট্য দেখতে দেয় শুধুমাত্র তার ওপর মাউস হোভার করে। স্টাইলগুলো লক করতে ক্লিক করুন, সরাসরি এডিট করুন এবং পেজে তাৎক্ষণিকভাবে পরিবর্তনগুলো প্রয়োগ হতে দেখুন।
আপনি লেআউট সমস্যা সমাধান করছেন বা আপনার পছন্দের কোনো ওয়েবসাইট স্টাডি করছেন, CSS Inspector একটি পরিষ্কার ফ্লোটিং প্যানেলে আপনার প্রয়োজনীয় সবকিছু সরবরাহ করে। ব্রাউজারের ডেভ-টুল না খুলেই সহজে ইনস্পেক্ট করুন।
যেকোনো এলিমেন্টের ওপর হোভার করলে ফন্ট, সাইজ, কালার, স্পেসিং এবং আরও অনেক কিছু তাৎক্ষণিকভাবে দেখুন।
প্যানেলটি যাতে হারিয়ে না যায় সেজন্য এলিমেন্টে ক্লিক করে লক করুন, যা বিস্তারিত ইনস্পেকশনের সুযোগ দেয়।
ভ্যালুগুলো সরাসরি পরিবর্তন করতে সেগুলোর ওপর ডাবল ক্লিক করুন। আপনার এডিটগুলো পেজে তাৎক্ষণিকভাবে প্রতিফলিত হবে।
এক ক্লিকে আপনার ক্লিপবোর্ডে ব্যক্তিগত বৈশিষ্ট্য বা সম্পূর্ণ ডিজাইন স্টাইল ব্লক কপি করুন।
মার্জিন, বর্ডার এবং প্যাডিং ভ্যালুগুলো ভিজ্যুয়ালি দেখুন।
পেজে এলিমেন্টের প্রস্থ, উচ্চতা এবং অবস্থান প্রদর্শন করে।
CSS Inspector ৪০টিরও বেশি বৈশিষ্ট্য দেখায়:
font-familyfont-sizefont-weightline-heightletter-spacingtext-aligntext-transformcolorwidthheightpaddingmarginborderborder-radiusbox-sizingdisplaypositiontoprightbottomleftz-indexfloatoverflowbackground-colorbackground-imagebackground-sizebackground-positionopacitybox-shadowtext-shadowtransformtransitioncursorভুলভাবে সাজানো এলিমেন্টগুলো নিখুঁতভাবে ইনস্পেক্ট করুন।
আপনার প্রিয় ওয়েবসাইটগুলোর স্টাইল স্টাডি করুন।
কোড লেখার আগে পরিবর্তনগুলো টেস্ট করুন।
মিটিংয়ের সময় লাইভ পরিবর্তনগুলো দেখান।
নতুন এলিমেন্টের জন্য সহজেই CSS কোড সংগ্রহ করুন।
DevSuite Pro টুলবারে CSS Inspector আইকনে ক্লিক করুন।
যেকোনো এলিমেন্টের ওপর আপনার কার্সার নিয়ে যান তার বৈশিষ্ট্যগুলো দেখতে।
তথ্য প্যানেলটি পিন করতে এলিমেন্টে ক্লিক করুন।
অ্যাডজাস্ট করতে ভ্যালুগুলোর ওপর ডাবল ক্লিক করুন।
আপডেট করা কোডটি কপি করুন এবং আপনার প্রকল্পে ব্যবহার করুন।
বিনামূল্যে DevSuite Pro ইনস্টল করুন এবং আপনার ব্রাউজারের জন্য ৩৯+ ডেভলপার টুল আনলক করুন।