সক্ষম এইচটিএমএল কোড এবং সাধারণ সিএসএস বিধিগুলির সাহায্যে আপনি একটি পপ-আপ মেনু তৈরি করতে পারেন, এটি পরিপূরক করতে এবং এটি সংশোধন করতে পারেন। ক্যাসকেডিং টেবিল এবং মার্কআপ ল্যাঙ্গুয়েজ সরঞ্জামগুলি ব্যবহার করে আপনি নিশ্চিত করতে পারেন যে মেনুটি নিজেই সমস্ত ব্রাউজারগুলিতে সঠিকভাবে কাজ করে।
নির্দেশনা
ধাপ 1
প্রথমে বেসিক মেনু বারটি ধরে থাকুন। একটি পাঠ্য সম্পাদকের সাবমেনু দিয়ে একটি বিশেষ সংখ্যাযুক্ত তালিকা তৈরি করুন। সাধারণত "নোটপ্যাড" এই উদ্দেশ্যে ব্যবহৃত হয়। সাবমেনু পিতামাতার তালিকার একটি উপাদান হিসাবে কাজ করে। উদাহরণস্বরূপ: প্রথম এলিমেন্টফ্লাড এলিমেন্টফ্লাড এলিমেন্ট 2 ফিল্ড এলিমেন্ট 3 ফিল্ড এলিমেন্ট 4 ফিল্ড এলিমেন্ট 5
ধাপ ২
এই তালিকাটি একটি পৃথক এইচটিএমএল ফাইলে সংরক্ষণ করুন। তারপরে একটি.css ফাইল তৈরি করুন। সমস্ত প্রয়োজনীয় স্টাইল শীট পরামিতি প্রবেশ করান। এটি খুব সাবধানে করুন, কারণ একটি ভুল, এবং পপ-আপ মেনুটি সঠিকভাবে প্রদর্শিত হবে না বা কিছুতেই কাজ করবে না।
ধাপ 3
বুলেট তালিকায় প্রয়োগ করা কোনও বুলেট এবং প্যাডিং সরান। সিএসএস সরঞ্জাম ব্যবহার করে মেনুটির প্রস্থ সেট করুন: উল স্টাইল: কোনও নয়; প্রস্থ: 200px; }
পদক্ষেপ 4
তালিকার সমস্ত আইটেমের আপেক্ষিক অবস্থান চিহ্নিত করুন একটি অ্যাট্রিবিউট পজিশন সহ: উল লি: আপেক্ষিক; }
পদক্ষেপ 5
তারপরে সাবমেনুটি সাজান, যার উপাদানগুলি মাউস কার্সারটি আইটেমের উপরে চলে গেলে মূল মেনু থেকে ডানদিকে প্রদর্শিত হবে: li ul: পরম; বাম: 199px; শীর্ষ: 0; প্রদর্শন: কিছুই নয়; }
পদক্ষেপ 6
বাম বৈশিষ্ট্যটি মেনুটির প্রস্থের চেয়ে এক পিক্সেল কম। এটি পপ-আপ আইটেমগুলিকে ডাবল সীমানা তৈরি না করে সঠিকভাবে অবস্থান করতে দেয়। পৃষ্ঠাটি খোলার সময় প্রদর্শন বৈশিষ্টটি সাবমেনুটি আড়াল করতে ব্যবহৃত হয়।
পদক্ষেপ 7
উপযুক্ত সিএসএস বিকল্পগুলি ব্যবহার করে প্রয়োজনীয় লিঙ্কগুলি স্টাইল করুন। প্রদর্শন অন্তর্ভুক্ত করুন: ব্লক প্যারামিটার যাতে লিঙ্কগুলি তাদের জন্য সংরক্ষিত সমস্ত স্থান গ্রহণ করে। যখন মাউস কার্সার এটির উপর দিয়ে ঘুরে বেড়াচ্ছে তখন মেনুটি উপস্থিত হওয়ার জন্য, নিম্নলিখিত কোডটি প্রবেশ করুন: li: হোভার উল: ব্লক; }
পদক্ষেপ 8
পছন্দসই হিসাবে তালিকা আইটেম এবং লিঙ্কগুলি প্রদর্শনের জন্য অতিরিক্ত বিকল্প সেট করুন।. Html ফাইলটিতে একটি বৈশিষ্ট্য অন্তর্ভুক্ত করুন। পপ-আপ মেনুটি ব্যবহারের জন্য প্রস্তুত।
