আমরা ব্যাকগ্রাউন্ড অ্যাট্রিবিউট ব্যবহার করে একটি উপাদানের পটভূমি বৈশিষ্ট্য নির্দিষ্ট করতে পারি। এটি নিম্নলিখিতগুলির জন্য মান নিতে পারে:ব্যাকগ্রাউন্ড-রঙ, ব্যাকগ্রাউন্ড-ইমেজ, ব্যাকগ্রাউন্ড-রিপিট, ব্যাকগ্রাউন্ড-পজিশন, ব্যাকগ্রাউন্ড-ক্লিপ, ব্যাকগ্রাউন্ড-সাইজ, ব্যাকগ্রাউন্ড-অরিজিন এবং ব্যাকগ্রাউন্ড-অ্যাটাচমেন্ট।
সিনট্যাক্স
CSS ব্যাকগ্রাউন্ড প্রপার্টির সিনট্যাক্স নিম্নরূপ -
Selector {
background: /*value*/
} উদাহরণ
নিম্নলিখিত উদাহরণগুলি CSS ব্যাকগ্রাউন্ড প্রপার্টি −
চিত্রিত করে<!DOCTYPE html>
<html>
<head>
<style>
body {
background: gray url("https://www.tutorialspoint.com/pytorch/images/pytorch.jpg") no-repeat;
font-size: 1.2em;
color: black;
}
h2 {
-webkit-text-fill-color: transparent;
-webkit-text-stroke: 1px black;
}
p {
box-shadow: 0 0 5px 5px black;
}
</style>
</head>
<body>
<h2><i>PYTORCH Tutorial</i></h2>
<p>This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. </p>
<ul>
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
<li>Five</li>
</ul>
</body>
</html> আউটপুট
এটি নিম্নলিখিত আউটপুট দেয় -
উদাহরণ
<!DOCTYPE html>
<html>
<head>
<style>
h2 {
background-color: bisque;
}
div {
margin: auto;
background-color:orange;
width: 40%;
}
</style>
</head>
<body>
<h2>Demo Text</h2>
<div>demo demo demo demo</div>
</body>
</html> আউটপুট
এটি নিম্নলিখিত আউটপুট দেয় -
