Add multiple backgrounds to a single element. - HTML CSS CSS Property

HTML CSS examples for CSS Property:background

  1. HOME
  2. HTML CSS
  3. CSS Property
  4. background

Introduction

The backgrounds are layered on the top of one another along the z-axis.

Example

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>Example of CSS3 Multiple Backgrounds</title>
  <style type="text/css">
  .box {<!--from ww  w . jav a 2  s. c om-->
    width: 100%;
    height: 500px;
    background: url("https://www.java2s.com/style/demo/Opera.png") no-repeat center,  url("https://www.java2s.com/style/demo/Firefox.png")  no-repeat center, url("https://www.java2s.com/style/demo/Google-Chrome.png")  no-repeat 10% 30%, lightblue;
  }
</style>
 </head>
 <body>
  <div class="box">
  
  
  </div>
 </body>
</html>

Related Tutorials