সিএসএস ফ্লোটিং - Css Floating



সিএসএস ফ্লোট প্রপার্টি ব্যবহার করে কোন এলিমেন্টকে ডানে বা বামে প্রদর্শন করা যায়।


কিভাবে ফ্লোট হয় ?

ফ্লোট প্রপার্টি ব্যবহার করে এলিমেন্ট গুলোকে আনুভূমিক বা horizontaly অর্থাৎ ডানে বা বামে ফ্লো বা স্থাপন করা যায়। কিন্তু এলিমেন্টগুলোকে কখনো ওপরে বা নিচে ফ্লোট করা যায় না।

যে এলিমেন্টের সাথে float প্রপার্টি ব্যবহার করা হয় তার পরের সব এলিমেন্টেই এর প্রভাব পরে, কিন্তু পূর্বের এলিমেন্টগুলোতে কোন প্রভাব পরে না।
যদি একটি ইমেজে 'float' প্রপার্টির মান 'right' নির্ধারণ করা হয়, তবে এর সাথে থাকা অন্য টেক্সটগুলো কিন্তু বাম দিকেই প্রদর্শিত হবে। নীচে একটি উদাহরণ দেখুন -

কোড দেখুন

img{
float:right;
}




clear প্রপার্টির ব্যবহার

যে এলিমেন্টের সাথে float প্রপার্টি ব্যবহার করা হয় তার পরের সব এলিমেন্টেই এর প্রভাব পরে, কিন্তু পূর্বের এলিমেন্টগুলোতে কোন প্রভাব পরে না। এই সমস্যা সমাধানের জন্য clear প্রপার্টি ব্যবহার করুন। clear প্রপার্টির মান বা value হিসেবে left, right বা both ব্যবহার করুন।

নীচে একটি উদাহরণ দেখুন যেখানে, একটি ইমেজ গ্যালারীর মাঝে কোন টেক্সটের floating নির্ধারণ করা হয়েছে -

উদাহরণ

#news_title{
clear:both;
}




সিএসএস এর সকল ফ্লোট প্রপার্টি

প্রপার্টি বর্ণনা মান ভার্সন
clear একটি এলিমেন্টের কোন দিকে অন্য কোন এলিমেন্ট ফ্লো করবে না তা নির্ধারণ করে। left
right
both
none
inherit
1
loat কোন বক্স ফ্লোট করবে কি না তা নির্দিষ্ট করে। left
right
none
inherit
1






এই ওয়েব সাইট এর সমস্ত টিউটোরিয়াল, সার্কিট ডায়াগ্রাম, উদাহরণ ইত্যাদি খুব সহজ ও সাধারণ ভাবে তৈরি করা হয়েছে। টিউটোরিয়াল, সার্কিট ডায়াগ্রাম, উদাহরণ ইত্যাদির ভুল পরিহার করার জন্য বার বার যাচাই করা হয়েছে, কিন্তু আমরা এর পূর্ণ নিশ্চয়তা ও দায়ভার বহন করি না। যখন আপনি এই সাইটটি ব্যবহার করেন, আমরা ধরে নেই যে আপনি পড়েছেন এবং সম্মত আছেন আমাদের টার্মস অফ ইউস (Terms of use) এবং প্রাইভেসি পলিসি( Privacy policy) সম্পর্কে।

Copyright 2016-2018 by websschool.com, All Rights Reserved.