img background html code example

Example 1: background image css

.selector {
  background-image: url(image.png);
}

Example 2: inserting a image in html backgound

<html>
  <style>
	body
      {
      background-color: url('url from web'); /* replace "url from the web" with your url*/
      }
  </style>
  <body>
    <!-- Your body displayed with the picture-->
    <h1></h1> 
  </body>  
</html>

Example 3: add background image in css

.w {
background-image: url("images/tom1.png");
}

.a {
background-image: url("images/tom2.png");
}

.s {
background-image: url("images/tom3.png");
}

Example 4: how to embed a url in html for background

div {
   /* Background pattern from Toptal Subtle Patterns */
   background-image: url("https://amymhaddad.s3.amazonaws.com/morocco-blue.png");
   height: 400px;
   width: 100%;
}

Example 5: adding background image css

/* Answer to: "adding background image css" */

/*
  The background-image property sets one or more background images
  for an element.

  By default, a background-image is placed at the top-left corner
  of an element, and repeated both vertically and horizontally.

  Tip: The background of an element is the total size of the
  element, including padding and border (but not the margin).

  Tip: Always set a background-color to be used if the image is
  unavailable.
*/

/* Set a background-image for the <body> element: */

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

/* Set two background images for the <body> element: */

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

Tags:

Misc Example

Recent Posts