কম্পিউটার টিউটোরিয়াল

CSS-এ ব্যাকগ্রাউন্ড কালার সেট করা

আমরা background-color প্রপার্টি ব্যবহার করে একটি এলিমেন্টের ব্যাকগ্রাউন্ড কালার নির্দিষ্ট করতে পারি। মানগুলো স্ট্যান্ডার্ড নাম, rgb(), rgba(), hsl() বা hsla() দিয়ে দিতে পারি।

সিনট্যাক্স

CSS background-color প্রপার্টির সিনট্যাক্স নিম্নরূপ:

Selector {    background-color: /*মান*/ }

উদাহরণ

নিচের উদাহরণগুলো CSS background-color প্রপার্টি উদাহরণ দেয়:

<!DOCTYPE html> <html> <head> <style> p:first-of-type {    font-family: cursive;    background-color: pink; } p:last-child {    background-color: azure; } div {    margin: auto;    padding: 5px;    font-family: Helvetica;    width: 430px;    background-color: burlywood; } </style> </head> <body> <p> Java is a high-level programming language originally developed by Sun Microsystems.<p> <div> Java released in 1995</div> <p> Java runs on a variety of platforms such as Windows, Mac OS, and the various versions of UNIX.</p> </body> </html>

আউটপুট

এটি নিচের আউটপুট দেয়:

CSS-এ ব্যাকগ্রাউন্ড কালার সেট করা

আরেকটি উদাহরণ

<!DOCTYPE html> <html> <head> <style> div {    background-color: springgreen; } h1 {    background-color: lightcoral;    text-align: center; } p {    background-color: lightseagreen;    font-size: 150%; } </style> </head> <body> <div> <h1>Demo</h1> <p>This is demo text1. This is demo text2. This is demo text3. </p> </div> </body> </html>

আউটপুট

এটি নিচের আউটপুট দেয়:

CSS-এ ব্যাকগ্রাউন্ড কালার সেট করা

  1. CSS দিয়ে লিংকের রঙ সেট করা

  2. CSS-এ কালার প্রপার্টি সেট করা: টেক্সট, বর্ডার, ব্যাকগ্রাউন্ড

  3. CSS color প্রপার্টি দিয়ে এলিমেন্টের টেক্সট রঙ পরিবর্তন

  4. CSS দিয়ে স্ক্রলে গ্রেডিয়েন্ট ব্যাকগ্রাউন্ড কালার পরিবর্তন