How To Make The Background Image Full Screen In Html Code Example
Example 1: set background image full screen css #mainBackground { width : 100 % ; height : 100 % ; max-height : 100 % ; margin : 0 ; padding : 0 ; background-image : url ( "https://images.unsplash.com/photo-1487058792275-0ad4aaf24ca7?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=750&q=80" ) ; background-size : 100 % 100 % ; background-repeat : no-repeat ; } html , body { height : 100 % ; margin : 0 ; padding : 0 ; } Example 2: css background image full screen responsive html { background : url ( images/bg.jpg ) no-repeat center center fixed ; -webkit-background-size : cover ; -moz-background-size : cover ; -o-background-size : cover ; background-size : cover ; } Example 3: html background image fit to screen body { background-position : center ; background-repeat : no-repeat ; background-size : contain ; }