html - এমএল - সিএসএস কি




কিভাবে আমি এইচটিএমএল/সিএসএস একটি ইমেজ মাত্র একটি অংশ প্রদর্শন করতে পারেন? (2)

আরেকটি বিকল্প নিম্নরূপ, তবে এটি পরিষ্কার নয় যদিও এটি একটি ধারকের একমাত্র উপাদান হিসাবে অনুমান করে, যেমন এই ক্ষেত্রে:

<header class="siteHeader">
  <img src="img" class="siteLogo" />
</header>

তারপর আপনি কনটেইনারটিকে পছন্দসই আকারের সাথে একটি মাস্ক হিসাবে ব্যবহার করতে পারেন, এবং ছবিটি নেতিবাচক মার্জিনের সাথে সঠিক অবস্থানে স্থানান্তরিত করতে পারেন:

.siteHeader{
    width: 50px;
    height: 50px;
    overflow: hidden;
}

.siteHeader .siteLogo{
    margin: -100px;
}

ডেমো এই JSFiddle দেখা যায়।

শুধু IE> 9, এবং সম্ভবত অন্যান্য ব্রাউজারের সব উল্লেখযোগ্য সংস্করণে কাজ বলে মনে হয়।

চলুন বলি যে আমি একটি চিত্রের 50x50px কেন্দ্রটি প্রদর্শনের একটি উপায় চাই যা HTML এ 250x250px এর। আমি এটা কিভাবে করবো. এছাড়াও, CSS এর জন্য এটি করার একটি উপায় আছে: url () রেফারেন্স?

আমি সিএসএস ক্লিপ সচেতন, কিন্তু পরম অবস্থান সঙ্গে ব্যবহৃত যখন শুধুমাত্র কাজ বলে মনে হয়।


এটি করার একটি উপায় হল আপনি যে চিত্রটি একটি ধারক (টিডি, ডিভি, স্প্যান ইত্যাদি) তে ব্যাকগ্রাউন্ড হিসাবে প্রদর্শন করতে চান তা সেট করতে এবং তারপর স্প্রেট পেতে আপনার পটভূমি-অবস্থান সামঞ্জস্য করুন।





image