CSS background-image
background-image பண்புத்தொகுப்பு ஒரு உறுப்பின் பின்னணியாகப் பயன்படுத்த ஒரு படத்தைக் குறிக்கிறது.
இயல்பாக, படம் மீண்டும் மீண்டும் வரும், எனவே இது முழு உறுப்பையும் மூடுகிறது.
எடுத்துக்காட்டு
ஒரு பக்கத்திற்கான பின்னணி படத்தை அமைக்கவும்:
body {
background-image: url("paper.gif");
}
இது ஒரு நல்ல பின்னணி பட எடுத்துக்காட்டு. உரை எளிதில் படிக்கக்கூடியது.
எடுத்துக்காட்டு
இந்த எடுத்துக்காட்டு உரை மற்றும் பின்னணி படத்தின் மோசமான கலவையைக் காட்டுகிறது. உரை கிட்டத்தட்ட படிக்க முடியாதது:
body {
background-image: url("bgdesert.jpg");
}
இது ஒரு மோசமான பின்னணி பட எடுத்துக்காட்டு. உரை படிக்க கடினமானது.
குறிப்பு:
பின்னணி படத்தைப் பயன்படுத்தும் போது, உரையைக் குழப்பாத ஒரு படத்தைப் பயன்படுத்தவும்.
பின்னணி படம்
பின்னணி படம் <p> உறுப்பு போன்ற குறிப்பிட்ட உறுப்புகளுக்கும் அமைக்கப்படலாம்:
எடுத்துக்காட்டு
p {
background-image: url("paper.gif");
}
இந்த <p> உறுப்புக்கு பின்னணி படம் அமைக்கப்பட்டுள்ளது. இது காகிதப் பின்னணியைப் போல தோற்றமளிக்கிறது.
CSS பயிற்சிகள்
பயிற்சி:
பின்னணி படத்தை அமைக்க எந்த CSS பண்புத்தொகுப்பு பயன்படுத்தப்படுகிறது?
CSS பின்னணி பட பண்புத்தொகுப்பு
| பண்புத்தொகுப்பு | விளக்கம் |
|---|---|
| background-image | ஒரு உறுப்புக்கான பின்னணி படத்தை அமைக்கிறது |