সাধারণ ফ্লো

স্বাভাবিক প্রবাহ বেশিরভাগ পরিস্থিতিতে ওয়েব পৃষ্ঠায় উপাদানগুলিকে প্রদর্শিত হয়। এইচটিএমএল এর সব উপাদান ভিতরের বাক্সে থাকে যা হয় ইনলাইন বক্স বা ব্লক বক্স।

আউট ব্লক বক্সগুলি বহন

স্বাভাবিক প্রবাহে, ব্লক বক্সগুলি অন্য পৃষ্ঠার পরে একটি পৃষ্ঠাতে স্থাপন করা হয় (যাতে তারা এইচটিএমএলতে লেখা থাকে)। তারা ধারণকারী বাক্সের উপরের বামে শুরু এবং উপরে থেকে নীচে স্ট্যাক। প্রতিটি বাক্সের মধ্যে দূরত্বটি একে অপরের মধ্যে সঙ্কুচিত শীর্ষ এবং নীচের মার্জিন সঙ্গে মার্জিন দ্বারা সংজ্ঞায়িত করা হয়।

উদাহরণস্বরূপ, আপনার নিম্নলিখিত HTML থাকতে পারে:

এই প্রথম div হয় এটি প্রায় পিক্সেলের প্রশস্ত একটি 5px মার্জিন এর কাছাকাছি।

এটি একটি বৃহত্তর ডিভি।

এটি একটি div যে দ্বিতীয় এক তুলনায় একটু বৃহত্তর।

প্রতিটি DIV একটি ব্লক উপাদান, তাই এটি পূর্ববর্তী ব্লক উপাদান নীচে স্থাপন করা হবে। প্রতিটি বাম প্রান্তটি ব্লকটির বাম প্রান্তকে স্পর্শ করবে।

ইনলাইন বাক্সে রাখা

ইনলাইন বাক্সে অনুভূমিকভাবে পৃষ্ঠাটি বহন করা হয়, আরেকটি পরে ধারক উপাদান শীর্ষে শুরু হয়। যখন একটি লাইনের ইনলাইন বাক্সের সমস্ত উপাদান মাপতে পর্যাপ্ত স্থান নেই, তখন তারা পরবর্তী লাইনটি আবৃত করে এবং সেখানে থেকে উল্লম্বভাবে স্ট্যাক করে।

উদাহরণস্বরূপ, নিম্নলিখিত HTML- এ:

এই পাঠটি দারুণ এবং এই পাঠটি তাত্তিক হয় । এবং এই প্লেইন টেক্সট।

অনুচ্ছেদটি একটি ব্লক উপাদান, তবে 5 টি ইনলাইন উপাদান রয়েছে:

তাই স্বাভাবিক প্রবাহ ওয়েব ডিজাইনার দ্বারা কোন হস্তক্ষেপ ছাড়াই এই ব্লক এবং ইনলাইন উপাদানগুলি ওয়েব পৃষ্ঠায় প্রদর্শিত হবে।

যদি আপনি কোনও পৃষ্ঠাতে একটি উপাদান তৈরি করতে প্রভাবিত করতে চান তবে আপনি CSS পজিশনিং বা CSS ফ্লোটগুলি ব্যবহার করতে পারেন।