set background using css code example

Example 1: how to blur background color in css

background: rgba(255,255,255,0.5);
backdrop-filter: blur(5px);

Example 2: how to add background in css

body {
 background-image: url("paper.gif");
 background-color: #cccccc;
}

Example 3: background image html

<!-- Background images are better implemented in CSS -->
<!-- but here is how you could do it in HTML in a pinch -->

<head>
  <style>
    .background {
      background-image: url(https://cleananddelicious.com/wp-content/uploads/2016/03/Avocad0-CD.jpg);
    }
  </style>
</head>

<body>
  <div class=background>
    <h1>The background of this div will be an avocado</h1>
  </div>
</body>

Example 4: background in css

/* There are several ways of setting a background, like in HTML or CSS
	(I advise you to set it in CSS) You can set a colour or image with
	the same attribute: */

/* Setting the colour in a div, body, html (html is the whole page),
	class, and id: */
div, body, html, .myClass, #myId {
	background-color: grey;
}
/* Setting the image: */
div {
	background: url("img.jpg");
}
/* If you want to call an image from a specific directory use a '/'.
	For example, the image is in a folder called 'Images' (the HTML
	and CSS files have to be in the same folder as the 'Images folder') */
div {
	background: url("Images/img.jpg");
}

Tags: