CSS justify-content প্রতিশব্দ

定义和用法

justify-content 属性(水平)对齐弹性容器的项目,当项目不占用主轴上所有可用空间时。

টীকা:ব্যবহার করুন align-items প্রতিভূতি আইটেমকে ভিক্তি বানানোর জন্য প্রতিভূতি

অন্যান্য দেখুন:

CSS শিক্ষাক্রম:CSS flexbox

CSS শিক্ষাক্রম:CSS Grid

CSS সংক্রান্ত পরিচ্ছন্নকরণ:align-content প্রতিভূতি

CSS সংক্রান্ত পরিচ্ছন্নকরণ:align-items প্রতিভূতি

CSS সংক্রান্ত পরিচ্ছন্নকরণ:align-self প্রতিভা

HTML DOM সংক্রান্ত পরিচ্ছন্নকরণ:justifyContent প্রতিভা

প্রকল্প

কনটেনারের মধ্যবর্তী স্থানে ফ্লেক্সিবল প্রক্রিয়াকরণ সাজান:

div {
  display: flex;
  justify-content: center;
}

আপনাদের নিজেই প্রয়োগ করুন

পানের নিচে আরও TIY প্রকল্প পাবেন।

CSS ব্যবহার করা হয়:

justify-content: flex-start|flex-end|center|space-between|space-around|initial|inherit;

প্রতিভার মান

মান বর্ণনা
flex-start ডিফল্ট মান। প্রক্রিয়াকরণগুলি কনটেনারের শুরুতে অবস্থান করে。
flex-end প্রক্রিয়াকরণগুলি কনটেনারের শেষে অবস্থান করে。
center প্রক্রিয়াকরণগুলি কনটেনারের মধ্যবর্তী স্থানে অবস্থান করে。
space-between প্রক্রিয়াকরণগুলির মধ্যবর্তী সারিতে বিস্তৃতি রাখা হয়。
space-around প্রক্রিয়াকরণগুলির আগে, মধ্যবর্তী এবং পরের সারিতে জায়গা রাখা হয়。
initial এই প্রতিভাটিকে তার ডিফল্ট মান নির্ধারণ করুন। দেখুন: initial
inherit এই প্রতিভাটিকে তার পিতৃত্ব থেকে উত্তরসূরী করুন। দেখুন: inherit

প্রযুক্তিগত বিবরণ

ডিফল্ট মান: flex-start
উত্তরসূরী: না
অ্যানিমেশন তৈরি: সমর্থন না হয়। দেখুন:অ্যানিমেশন সংক্রান্ত প্রতিভা
সংস্করণ: CSS3
JavaScript ব্যবহার করা হয়: object.style.justifyContent="space-between"

আরও প্রকল্প

প্রকল্প

কনটেনারের শুরুতে ফ্লেক্সিবল প্রক্রিয়াকরণ সাজান (ডিফল্ট):

div {
  display: flex;
  justify-content: flex-start;
}

আপনাদের নিজেই প্রয়োগ করুন

প্রকল্প

কনটেনারের শেষে ফ্লেক্সিবল প্রক্রিয়াকরণ সাজান:

div {
  display: flex;
  justify-content: flex-end;
}

আপনাদের নিজেই প্রয়োগ করুন

প্রকল্প

মধ্যবর্তী সারিতে বিস্তৃতির সাথে ফ্লেক্সিবল প্রক্রিয়াকরণ প্রদর্শন করুন:

div {
  display: flex;
  justify-content: space-between;
}

আপনাদের নিজেই প্রয়োগ করুন

প্রকল্প

একটি সারির আগে, মধ্যবর্তী এবং পরের সারিতে বিস্তৃতির সাথে ফ্লেক্সিবল প্রক্রিয়াকরণ প্রদর্শন করুন:

div {
  display: flex;
  justify-content: space-around;
}

আপনাদের নিজেই প্রয়োগ করুন

ব্রাউজার সমর্থন

টেবিলের সংখ্যা এই প্রতিভাটিকে সম্পূর্ণরূপে সমর্থনকারী প্রথম ব্রাউজার সংস্করণকে উল্লেখ করে।

প্রতিষ্ঠান -webkit- বা -moz- এর সংখ্যা নির্দিষ্ট প্রথম সংস্করণ ব্যবহার করা হয়।

প্রতিভা Chrome IE Firefox Safari Opera
justify-content 29.0
21.0 -webkit-
11.0 28.0
18.0 -moz-
9.0
6.1 -webkit-
17.0