- Trending Categories
Data Structure
Networking
RDBMS
Operating System
Java
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Setting up Background Color in CSS
We can specify the background color of an element using background-color property. We can specify values by standard names, rgb(), rgba(), hsl() or hsla().
Syntax
The syntax of CSS background-color property is as follows −
Selector { background-color: /*value*/ }
Example
The following examples illustrate CSS background-color property −
<!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>
Output
This gives the following output
Example
<!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>
Output
This gives the following output −
- Related Articles
- Setting up Background Color using CSS
- Setting Background Position in CSS
- Setting Background color for Tkinter in Python
- Setting Color Property in CSS
- Setting Background Position using CSS
- Setting Background Image using CSS
- Setting Text Color using CSS
- Setting Text Color Working with CSS
- Setting the Color of Links using CSS
- Setting the Location Color Stops using CSS
- Usage of background-color property in CSS
- Setting the element's text color using CSS
- Set the background color of an element with CSS
- Perform Animation on the background-color property with CSS
- Set the opacity for the background color with CSS

Advertisements