CSS প্রক্ষেপ পুনরাবৃত্তি

CSS background-repeat

ডিফল্টে,background-image এই প্রতিভা অনুপ্রস্থ ও উপরোক্ত দিকেই ছবি পুনরায় অবতীর্ণ করে

কিছু ছবি শুধুমাত্র অনুপ্রস্থ বা উপরোক্ত দিকে পুনরায় অবতীর্ণ হওয়ার জন্য উপযুক্ত, না তবে তারা এমনভাবে দেখতে বিষম হবে:

ইনস্ট্যান্স

body {
  background-image: url("gradient_bg.png");
}

স্বয়ংক্রিয়ভাবে প্রয়োগ করুন

যদি উপরোক্ত ছবি শুধুমাত্র অনুপ্রস্থ দিকে ক্রমান্বয়ে পুনরায় অবতীর্ণ হতে চানbackground-repeat: repeat-x;) তবে পিছনের অংশ আরও ভালো দেখাবে:

ইনস্ট্যান্স

body {
  background-image: url("gradient_bg.png");
  background-repeat: repeat-x;
}

স্বয়ংক্রিয়ভাবে প্রয়োগ করুন

টীকা:যদি আপনি অভিকর্মণকারী ছবি উপরোক্ত সমতলে করতে চান background-repeat: repeat-y;

CSS background-repeat: no-repeat

background-repeat এটি ব্যাকগ্রাউন্ড ইমেজকে একবার মাত্র দেখানো হবে নির্দেশ করে

ইনস্ট্যান্স

ব্যাকগ্রাউন্ড ইমেজকে একবার মাত্র দেখানো হবে:

body {
  background-image: url("tree.png");
  background-repeat: no-repeat;
}

স্বয়ংক্রিয়ভাবে প্রয়োগ করুন

এই উদাহরণে, ব্যাকগ্রাউন্ড ইমেজ এবং টেক্সট একই স্থানে অবস্থান করে।আমরা ইমেজের অবস্থান বদলাতে চাই, যাতে ইমেজ টেক্সটকে বেশি বাধা দেবে না。

CSS background-position

background-position এটি ব্যাকগ্রাউন্ড ইমেজের অবস্থান নির্দেশ করে

ইনস্ট্যান্স

ব্যাকগ্রাউন্ড ইমেজকে ডান উপর কোণে রাখুন:

body {
  background-image: url("tree.png");
  background-repeat: no-repeat;
  background-position: right top;
}

স্বয়ংক্রিয়ভাবে প্রয়োগ করুন