❐CSS❐

❐wD Learn

CSS

CSS Introduction

CSS Selectors

CSS Color

CSS Background

CSS Border

CSS Margin

CSS Padding

CSS Box Model

CSS Text

CSS Font

CSS Link

CSS List

CSS Overflow

CSS Display

CSS Combinators

CSS Pseudo-classes

CSS Navigation Bar

CSS Hover

CSS Z-index

CSS Media Queries

CSS Shadow

CSS 2D Transform

CSS Animations

CSS Button

CSS FlexBox

CSS Grid

CSS Pagination

CSS Background The CSS background property helps set the background style, property, and effects of the element.

Background color The background color property sets the background colour of HTML tags such as div, section, p, etc.

Syntax


selector {

background-color: color;

}

Example


<html>
<head>
<style>
div {

background-color: yellow;

}
h1 {

background-color: #FF0000;

}
p {

background-color: orange;

}
span {

background-color: purple;

}
</style>
</head>
<body>
<div>
<h1>CodeWithme</h1>
<p>Developer and founder of <span>This Website</span></p>
</div>
</body>
</html>
Background Image The Background Image property sets an image as a background by providing the image URL within the url() function.

Syntax


selector {

background-image: url('image-url');

}

Example


<style>
div {

background-image: url('bhai.png');

}
</style>
Background Size The Background Size property sets custom sizes for the background image.

Syntax


selector {

background-size: property-value;

}
Cover The image fits the whole screen according to the dimensions; the background area will be completely covered by the image

Syntax


div {

background-image: url("./bhai.png");
background-size: cover;

}