কম্পিউটার টিউটোরিয়াল

CSS-এ columns শর্টহ্যান্ড প্রোপার্টি

CSS-এ কলাম তৈরি করতে columns শর্টহ্যান্ড প্রোপার্টি ব্যবহার করা হয়। এটি column-width এবং column-count একসাথে সেট করে।

উদাহরণ

নিচের কোডটি চালিয়ে columns প্রোপার্টির ব্যবহার দেখুন:

<!DOCTYPE html> <html> 
  <head> 
    <style> 
      .demo { 
        column-rule-color: gray; 
        columns: 100px 4; 
        column-rule-style: dashed; 
      } 
    </style> 
  </head> 
  <body> 
    <div class="demo"> 
      This is demo text. This is demo text. This is demo text. This is demo text. 
      This is demo text. This is demo text. This is demo text. This is demo text. 
      This is demo text. This is demo text. This is demo text. This is demo text. 
      This is demo text. This is demo text. This is demo text. This is demo text. 
      This is demo text. This is demo text. This is demo text. This is demo text. 
      This is demo text. This is demo text. This is demo text. This is demo text. 
    </div> 
  </body> 
</html>

ব্যাখ্যা: columns: 100px 4; মানে প্রতিটি কলামের ন্যূনতম প্রস্থ ১০০পিক্সেল এবং সর্বোচ্চ ৪টি কলাম থাকবে। column-rule কলামগুলোর মাঝপথে বিভাজক রেখা যোগ করে।

  1. CSS margin প্রপার্টি অ্যানিমেট করুন

  2. CSS text-indent প্রপার্টি অ্যানিমেট করুন

  3. CSS text-justify প্রপার্টি ব্যবহার

  4. CSS right প্রপার্টি ব্যবহার