CSS background শর্টহ্যান্ড প্রপার্টি একটি এলিমেন্টের জন্য ব্যাকগ্রাউন্ড ডিফাইন করতে ব্যবহৃত হয়। background-color, background-image, background-repeat, background-position, background-clip, background-size, background-origin এবং background-attachment মিলে CSS background প্রপার্টি তৈরি করে।
সিনট্যাক্স
CSS background প্রপার্টির সিনট্যাক্স নিচের মতো:
Selector { background: /*value*/ }
উদাহরণ
নিচের উদাহরণগুলো CSS background প্রপার্টি ব্যাখ্যা করে:
<!DOCTYPE html> <html> <head> <style> body { background: linen url("https://www.tutorialspoint.com/images/library-sub-banner.jpg") no-repeat 40% 20%; } div { padding: 100px; background: rgba(50,100,50,0.4)url("https://www.tutorialspoint.com/green/images/logo.png") no-repeat left; } </style> </head> <body> <h2>Learn</h2> <ul> <li>Java</li> <li>C#</li> <li>Android</li> <li>iOS</li> <li>C++</li> <li>C</li> </ul> <div></div> </body> </html>
আউটপুট
উপরোক্ত কোডের আউটপুট:
উদাহরণ
<!DOCTYPE html> <html> <head> <style> table, tr,td{ margin: auto; border: 2px solid red; padding: 40px; } td { background: rgba(50,100,50,0.4)url("https://www.tutorialspoint.com/images/blockchain.png") no-repeat; } #demo { background: rgba(50,100,50,0.4)url("https://www.tutorialspoint.com/images/reactjs.png") no-repeat; } table { background: ivory url("https://www.tutorialspoint.com/images/library-sub-banner.jpg") no-repeat center; } </style> </head> <body> <h2>Learning is fun</h2> <table> <tr><td></td></tr> <tr><td id="demo"></td></tr> </table> </body> </html>
আউটপুট
উপরোক্ত কোডের আউটপুট:
