একটি ওয়েবসাইটের সামগ্রিক বিন্যাস, নির্দিষ্ট উপাদান শৈলী বুঝতে এবং CSS বাগগুলির জন্য AI তৈরি করা সংশোধনগুলি পেতে স্টাইলিংয়ের জন্য AI সহায়তা প্যানেলটি ব্যবহার করুন৷
"AI সহায়তা" প্যানেল খুলুন
AI সহায়তা প্যানেল ড্রয়ারে খোলে।
এলিমেন্টস প্যানেল থেকে
এলিমেন্টস প্যানেল থেকে AI সহায়তা খুলতে, একটি DOM নোড পরিদর্শন করার সময়, নোডটিতে ডান-ক্লিক করুন এবং জিজ্ঞাসা করুন AI বিকল্পটি নির্বাচন করুন।
আপনি যখন এইভাবে AI সহায়তা খুলবেন, পরিদর্শন করা DOM উপাদানটি ইতিমধ্যেই কথোপকথনের জন্য একটি প্রসঙ্গ উপাদান হিসাবে প্রাক-নির্বাচিত।
বিকল্পভাবে, হোভার করা DOM নোডের সাথে সংযুক্ত ভাসমান বোতামে ক্লিক করুন।
কমান্ড মেনু থেকে
কমান্ড মেনু থেকে এআই সহায়তা খুলতে, AI টাইপ করুন এবং তারপরে শো এআই সহায়তা কমান্ডটি চালান, যার পাশে ড্রয়ার ব্যাজ রয়েছে।
"আরো সরঞ্জাম" মেনু থেকে
বিকল্পভাবে, উপরের ডানদিকে, নির্বাচন করুন আরও বিকল্প > আরও সরঞ্জাম > AI সহায়তা ।
কথোপকথনের প্রসঙ্গ
AI সহায়তার সাথে চ্যাটগুলি সর্বদা বর্তমানে পরিদর্শন করা উপাদানের সাথে সম্পর্কিত, যা Elements প্যানেল DOM ট্রিতে নির্বাচিত শেষ উপাদান। এই উপাদানটির একটি রেফারেন্স প্যানেলের নীচে বাম কোণে দেখানো হয়েছে।
বর্তমান উপাদানের পাশে বা এলিমেন্ট প্যানেল DOM ট্রি থেকে নির্বাচন করে এলিমেন্ট পিকার ব্যবহার করে প্রসঙ্গ পরিবর্তন করুন।
প্রসঙ্গ নির্বাচন করে, আপনি ভিউপোর্টের একটি স্ক্রিনশট ক্যাপচার করতে পারেন এবং আপনার চ্যাটে জমা দিতে পারেন। চ্যাট ইনপুট ক্ষেত্রের পাশে স্ক্রিনশট নিন বোতামে ক্লিক করুন।
আপনি আপনার প্রম্পটে অতিরিক্ত ভিজ্যুয়াল প্রসঙ্গ প্রদান করতে স্ক্রিনশট ব্যবহার করতে পারেন, উদাহরণস্বরূপ, সমস্ত দৃশ্যমান বোতামে একই ব্যবধান আছে কিনা তা পরীক্ষা করতে।
যদিও বর্তমানে পরিদর্শন করা উপাদানটি কথোপকথনের ভিত্তি, পরিদর্শন করা পৃষ্ঠা থেকে আরও তথ্য সংগ্রহ করতে AI সহায়তার সমস্ত ওয়েব API-এ অ্যাক্সেস রয়েছে। এর মধ্যে রয়েছে document.querySelector এর মাধ্যমে অন্যান্য উপাদান অনুসন্ধান করা বা গণনা করা শৈলীর মূল্যায়ন।
প্রম্পটিং
একটি নতুন কথোপকথন শুরু করার সময়, স্টাইলিংয়ের জন্য AI সহায়তা আপনাকে দ্রুত শুরু করতে সাহায্য করার জন্য উদাহরণ প্রম্পট দেয়।
প্যানেলের নীচে প্রম্পট ইনপুট ক্ষেত্রটি প্রিফিল করতে যে কোনও প্রম্পটে ক্লিক করুন।
বিকল্পভাবে, ইনপুট ক্ষেত্রে আপনার নিজস্ব প্রম্পট বা প্রশ্ন টাইপ করুন।
একটি প্রম্পট পাঠাতে, হয় এন্টার টিপুন বা ইনপুট ক্ষেত্রের ডানদিকে তীরটিতে ক্লিক করুন৷
কথোপকথন প্রবাহ
একটি প্রম্পট পাঠানো স্টাইলিং এজেন্টের সাথে কথোপকথন শুরু করে। আপনার প্রম্পটের সর্বোত্তম উত্তর দেওয়ার জন্য প্রয়োজনীয় তথ্য পেতে, এজেন্ট জাভাস্ক্রিপ্ট তৈরি করে এবং চালায় যা ওয়েব APIs কল করে। এজেন্ট অগ্রগতি ধাপে দেখানো হয়. প্রাথমিক ধাপের অবস্থা Investigating…
স্টেপ লেবেল আপডেট হয় কারণ এজেন্ট আপনার প্রশ্নের সমাধান করার জন্য আরো নির্দিষ্ট ক্রিয়া সম্পাদন করে।
একবার এজেন্ট একটি চূড়ান্ত উত্তরে আসে, উত্তরটি তদন্তের ধাপগুলির নীচে প্রদর্শিত হয়, যার মধ্যে ফলো-আপ প্রম্পটের পরামর্শও রয়েছে।
কথোপকথন চালিয়ে যেতে প্রস্তাবিত প্রম্পটে ক্লিক করুন। ক্লিক করুন
পর্দার আড়ালে এআই সহায়তা কী করেছে তা আরও ভালভাবে বোঝার জন্য একটি তদন্ত পদক্ষেপ।
যখন আপনি একটি অগ্রগতি চিপ প্রসারিত করেন, তখন আপনি দেখতে পাবেন যে কোডটি এজেন্ট কার্যকর করেছে, এর সাথে এর রিটার্ন মান। এক্সিকিউটেড কোডটি আরও ব্যবহারের জন্য কপি করুন, যেমন কনসোল প্যানেলের মাধ্যমে এটি চালানো।
কথোপকথন থামানো হয়েছে
AI সহায়তা পার্শ্ব প্রতিক্রিয়া সহ কোড তৈরি করতে পারে। যখন এটি ঘটে, কোডটি কার্যকর করার আগে কথোপকথনটি বিরতি দেওয়া হয়।
কথোপকথন থামলে, এজেন্টের প্রস্তাবিত কোডটি পর্যালোচনা করুন। চালিয়ে যেতে চালিয়ে যান বা এক্সিকিউশন রোধ করতে বাতিল ক্লিক করুন।
আপনার কর্মক্ষেত্রে পরিবর্তনগুলি সংরক্ষণ করুন
একটি সংযুক্ত ওয়ার্কস্পেস ফোল্ডারের সাহায্যে, আপনি আপনার কম্পিউটারে CSS সোর্স ফাইলগুলিতে AI সহায়তা দ্বারা প্রস্তাবিত শৈলী পরিবর্তনগুলি সংরক্ষণ করতে পারেন।
এটি করতে:
প্রথমে, একটি মেটাডেটা ফাইল তৈরি করুন এবং একটি ওয়ার্কস্পেস ফোল্ডার সংযুক্ত করুন ।
বিকল্পভাবে, আপনি ম্যানুয়ালি একটি ফোল্ডার যোগ করতে পারেন।
এলিমেন্টস প্যানেল থেকে একটি চ্যাট শুরু করুন।
আপনার CSS পরিবর্তন করতে AI সহায়তার জন্য অনুরোধ করুন।
এআই সহায়তা কোড জেনারেট করতে পারে এবং এক্সিকিউশন পজ করতে পারে । কোড পর্যালোচনা করুন এবং পরিবর্তনগুলি লাইভ পরীক্ষা করতে অবিরত ক্লিক করুন৷
অসংরক্ষিত পরিবর্তন বিভাগটি প্রসারিত করুন এবং কর্মক্ষেত্রে প্রয়োগ করুন ক্লিক করুন।
একটি
diffপরিবর্তনগুলি পর্যালোচনা করুন এবং সমস্ত সংরক্ষণ করুন ক্লিক করুন৷
এই কর্মপ্রবাহ শিখতে, দেখুন:
কোন উত্তর দেয়নি
AI সহায়তা বিভিন্ন কারণে উত্তর নাও দিতে পারে।
আপনি যদি মনে করেন যে আপনার প্রম্পট এমন কিছু যা এআই সহায়তা নিয়ে আলোচনা করতে সক্ষম হওয়া উচিত, একটি বাগ ফাইল করুন ।
কথোপকথনের ইতিহাস
একবার আপনি একটি কথোপকথন শুরু করলে, প্রতিটি পরবর্তী উত্তর আপনার এবং AI-এর মধ্যে আপনার পূর্ববর্তী মিথস্ক্রিয়াগুলির উপর ভিত্তি করে।
AI সহায়তা সেশনের মধ্যে আপনার কথোপকথনের ইতিহাস সংরক্ষণ করে, যাতে আপনি DevTools বা Chrome পুনরায় লোড করার পরেও আপনার আগের চ্যাটগুলি অ্যাক্সেস করতে পারেন।
আপনার কথোপকথনের ইতিহাস নিয়ন্ত্রণ করতে প্যানেলের উপরের-বাম কোণে নিয়ন্ত্রণগুলি ব্যবহার করুন৷
নতুন করে শুরু করুন
বর্তমানে নির্বাচিত কথোপকথন প্রসঙ্গে একটি নতুন কথোপকথন শুরু করতে, বোতামটি ক্লিক করুন৷
চালিয়ে যান
অতীতের কথোপকথন চালিয়ে যেতে, বোতামে ক্লিক করুন এবং প্রসঙ্গ মেনু থেকে এটি নির্বাচন করুন।
মুছুন
ইতিহাস থেকে একটি কথোপকথন মুছে ফেলতে, বোতামটি ক্লিক করুন৷
রেট উত্তর এবং প্রতিক্রিয়া প্রদান
এআই সহায়তা একটি পরীক্ষামূলক বৈশিষ্ট্য। তাই আমরা কীভাবে উত্তরের গুণমান এবং সামগ্রিক অভিজ্ঞতা উন্নত করতে পারি তা জানতে আমরা সক্রিয়ভাবে আপনার প্রতিক্রিয়া খুঁজছি।
ভোট উত্তর
উত্তরের নিচে আপ এবং থাম্বস ডাউন বোতাম ব্যবহার করে একটি উত্তরকে রেট দিন।
রিপোর্ট উত্তর
অনুপযুক্ত বিষয়বস্তু রিপোর্ট করতে, ভোটিং বোতামের পাশে বোতামে ক্লিক করুন।