CSS object-position پراپرٹی

CSS object-position صفت استعمال کی جاتی ہے تاکہ <img> یا <video> کو اس کے کانٹینر میں کا مقام طے کیا جائے:

تصویر

نو، نیوکائن، وہ تصویر دیکھئے جو وہان سے آئی، 600x400 پیکسل کی پیمانے کا:

اب، ہم استعمال کریں گے object-fit: cover; پیمانے کو پورا کرنا اور اس کی پیمانے کا تناسب رکھنا، لیکن تصویر کو ایسے طرح کا کپتا جائے گا کہ یہ درج کیا جائے:

مثال

img {
  width: 266px;
  height: 400px;
  object-fit: cover;
}

خود سے کوشش کریں

object-position صفت استعمال کرکے

اگر نمائش والی تصویر کا حصہ ہماری چاہتی مقام پر نہیں ہو تو، تصویر کو مقام پر رکھنے کیلئے، ہم استعمال کریں گے object-position صفت

ایکدین، ہم اپنے استعمال کریں گے object-position صفت استعمال کرکے تصویر کو وسط میں رکھنا، قدیم عمارت کو وسط میں رکھنا:

مثال

img {
  width: 266px;
  height: 400px;
  object-fit: cover;
  object-position: 50% 100%;
}

خود سے کوشش کریں

ایکدین، ہم اپنے استعمال کریں گے object-position صورتوں کو نکالا کر، مشہور زیورشاہی کی عمارت کا کمر سمت چپ رکھا جائے، اس کا مذکور کیا جاتا ہے:

مثال

img {
  width: 266px;
  height: 400px;
  object-fit: cover;
  object-position: 25% 100%;
}

خود سے کوشش کریں

CSS object-* پراپرٹی

ایک درجہ بندی میں درج کیا گیا ہے، CSS object-* پراپرٹی: