সিএসএস ব্যাকগ্রাউন্ড-ইমেজ বৈশিষ্ট্যটি নির্বাচিত উপাদানের জন্য একটি পটভূমি হিসাবে একটি চিত্র সেট করতে ব্যবহৃত হয়৷
সিনট্যাক্স
CSS ব্যাকগ্রাউন্ড-ইমেজ প্রপার্টির সিনট্যাক্স নিম্নরূপ -
Selector {
background-image: /*value*/
} নিম্নলিখিত উদাহরণগুলি CSS ব্যাকগ্রাউন্ড-ইমেজ প্রপার্টি −
চিত্রিত করেউদাহরণ
<!DOCTYPE html>
<html>
<head>
<style>
#demo {
margin: 24px;
box-shadow: 0 0 5px black;
padding: 20px;
background-image: url("https://www.tutorialspoint.com/servlets/images/servlets.jpg");
background-origin: content-box;
background-repeat: no-repeat;
background-size: cover;
text-shadow: 0 1px white;
font-size: 1.4em;
}
p {
box-shadow: 0 0 5px grey;
}
</style>
</head>
<body>
<h2>Learn Python Blockchain</h2>
<div id="demo">
<p>Servlets are programs that run on a Web or Application server and act as a middle layer between a requests coming from a Web browser or other HTTP client and databases or applications on the HTTP server.
Using Servlets, you can collect input from users through web page forms, present records from a database or another source, and create web pages dynamically.</p>
</div>
</body>
</html> আউটপুট
এটি নিম্নলিখিত আউটপুট দেয় -
উদাহরণ
<!DOCTYPE html>
<html>
<head>
<style>
div {
height: 150px;
width: 150px;
background-image: url("https://www.tutorialspoint.com/spring/images/spring-mini-logo.jpg");
border: 2px solid brown;
}
div > div {
height: 80px;
width: 80px;
margin-right: 50px;
background-image: url("https://www.tutorialspoint.com/images/hibernate.png");
}
h1 {
background-image: url("https://www.tutorialspoint.com/hibernate/images/hibernate-patterns.jpg");
background-repeat: no-repeat;
color: black;
}
</style>
</head>
<body>
<h1>Demo</h1>
<div>
<div></div>
</div>
</body>
</html> আউটপুট
এটি নিম্নলিখিত আউটপুট দেয় -
