ওয়েব পেজ ডিজাইন করার সময়, ডেভেলপাররা ছবি, টেক্সট, টেবিল এবং অন্যান্য সহ বিভিন্ন উপাদান যোগ করতে পারে। অধিকন্তু, একাধিক CSS বৈশিষ্ট্য ব্যবহার করে পাঠ্যকে একটি ডিভিতে কেন্দ্রে সারিবদ্ধ করা যেতে পারে। পাঠ্যকে অনুভূমিকভাবে কেন্দ্রীভূত করার জন্য সবচেয়ে জনপ্রিয় পদ্ধতি হল ' পাঠ্য-সারিবদ্ধ ” বৈশিষ্ট্য। তাছাড়া, আপনি ব্যবহার করতে পারেন ' লাইনের উচ্চতা ' এবং ' উল্লম্ব-সারিবদ্ধ টেক্সট উল্লম্বভাবে সারিবদ্ধ করার জন্য বৈশিষ্ট্যাবলী।
এই পোস্টটি একটি ডিভের ভিতরে পাঠ্যটিকে উল্লম্বভাবে এবং অনুভূমিকভাবে কেন্দ্রীভূত করার পদ্ধতিটি বর্ণনা করবে:
কিভাবে একটি div ভিতরে অনুভূমিকভাবে টেক্সট কেন্দ্রে?
একটি div-এর ভিতরে পাঠ্যকে অনুভূমিকভাবে কেন্দ্রীভূত করতে, প্রদত্ত পদ্ধতিটি দেখুন।
ধাপ 1: একটি ডিভ কন্টেইনার তৈরি করুন
প্রাথমিকভাবে, 'এর সাহায্যে একটি ডিভ কন্টেইনার তৈরি করুন এখন, 'এর সাহায্যে div পাত্রে প্রবেশ করুন আইডি ' নির্বাচক সহ বৈশিষ্ট্যের নাম ' # এবং নিম্নলিখিত CSS বৈশিষ্ট্যগুলি প্রয়োগ করুন: এটি লক্ষ্য করা যায় যে আমরা তৈরি করা ডিভের ভিতরে অনুভূমিকভাবে সারিবদ্ধ পাঠ্যকে সফলভাবে কেন্দ্রীভূত করেছি: একটি div পাত্রে উল্লম্বভাবে পাঠ্য কেন্দ্রীভূত করতে, প্রদত্ত নির্দেশাবলী অনুসরণ করুন। ধাপ 1: div কন্টেইনার অ্যাক্সেস করুন প্রথমত, তৈরি ডিভ কন্টেইনার অ্যাক্সেস করুন। ধাপ 2: কেন্দ্র পাঠে উল্লম্বভাবে CSS বৈশিষ্ট্য প্রয়োগ করুন তারপরে, নীচের তালিকাভুক্ত CSS বৈশিষ্ট্যগুলিকে একটি ডিভিতে উল্লম্বভাবে কেন্দ্রের পাঠ্যের জন্য প্রয়োগ করুন: আউটপুট একটি div-এর ভিতরে টেক্সটটিকে উল্লম্বভাবে এবং অনুভূমিকভাবে কেন্দ্রীভূত করতে, প্রথমে,
< div আইডি = 'সারিবদ্ধ বিষয়বস্তু' >
লিনাক্সহিন্ট সেরা ওয়েবসাইটগুলির মধ্যে একটি জন্য বিষয়বস্তু তৈরি।
div >
আউটপুট
ধাপ 2: কেন্দ্র সারিবদ্ধ পাঠ্য থেকে div কন্টেইনার অ্যাক্সেস করুন
প্রস্থ: 80 % ;
মার্জিন: 0 স্বয়ংক্রিয়;
প্যাডিং: 20px;
পটভূমি: #c8edf3;
টেক্সট-সারিবদ্ধ: কেন্দ্র;
রঙ: আরজিবি ( 49 , পনের , 240 ) ;
}
এখানে:
কিভাবে একটি div ভিতরে টেক্সট উল্লম্বভাবে কেন্দ্রে?
প্রদর্শন: টেবিল-কোষ;
প্রস্থ: 300px;
উচ্চতা: 150px;
প্যাডিং: 10px;
রঙ: নীল;
ব্যাকগ্রাউন্ড-রঙ: rgb ( 248 , 215 , 166 ) ;
সীমানা: 3px ড্যাশ করা #f09d03;
উল্লম্ব-সারিবদ্ধ: মধ্যম;
}
উপরের কোড স্নিপেট অনুযায়ী:
আপনি উল্লম্ব এবং অনুভূমিক উভয় উপায়ে কন্টেইনারের ভিতরে পাঠ্যকে কেন্দ্র করার সম্পূর্ণ পদ্ধতি সম্পর্কে শিখেছেন। উপসংহার