Jassif Team Institution

CSS background-attachment

background-attachment பண்பு பின்னணி படம் ஸ்க்ரோல் செய்ய வேண்டுமா அல்லது நிலையானதாக இருக்க வேண்டுமா என்பதை குறிப்பிடுகிறது (பக்கத்தின் மற்ற பகுதிகளுடன் ஸ்க்ரோல் செய்யாது):

Fixed Background Example

பின்னணி படம் நிலையானதாக இருக்க வேண்டும் என குறிப்பிடவும்:

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

இந்த எடுத்துக்காட்டில், பின்னணி படம் பக்கத்துடன் ஸ்க்ர�்ள் செய்யாது. பயனர் பக்கத்தை மேலே அல்லது கீழே ஸ்க்ரோல் செய்தாலும், படம் அதே இடத்தில் நிலையாக இருக்கும்.

Scroll Background Example

பின்னணி படம் பக்கத்தின் மற்ற பகுதிகளுடன் ஸ்க்ரோல் செய்ய வேண்டும் என குறிப்பிடவும்:

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

இந்த எடுத்துக்காட்டில், பின்னணி படம் சாதாரண உள்ளடக்கத்துடன் ஸ்க்ரோல் செய்யும். பயனர் பக்கத்தை மேலே அல்லது கீழே நகர்த்தும்போது, பின்னணி படமும் நகரும்.

Exercise

The CSS Background Attachment Property