Hình nền trung tâm bootstrap

Bước 1. Tạo cấu trúc HTML cho các hình ảnh cần trình chiếu

 
 
 
  
 
   
 
     
     
     
   
 
  

 

 
 
  
 
   
 
    Cách tạo Background Slideshow cho Website bằng Bootstrap 
   



 
   
 
    
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
 
   
 
  

 

Bước 2. Định dạng CSS

html, body {	
height:100%;	
width:100%;	
position:relative;
}

#background-carousel {	
position:fixed;	
width:100%;	
height:100%;	
z-index:-1;
}
.carousel, .carousel-inner {	
width:100%;	
height:100%;	
z-index:0;	
overflow:hidden;
}
.item {	
width:100%;	
height:100%;	
background-position:center center;	
background-size:cover;	
z-index:0;
}

#content-wrapper {	
position:absolute;	
z-index:1 !important;	
min-width:100%;	
min-height:100%;
}
h1 {color:#F00}

Bước 3. Call library Bootstrap

Bước 4. Call library JQUERY

Bước 5. Tạo hiệu ứng Slide bằng JQUERY