Bulma.io를 사용하는 전체 페이지 이미지 배경?

Question

는 내가 Bulma.io CSS library

를 사용하여 웹 사이트를 설계하고 성공적으로 전체 페이지가 배경 색깔 만들었습니다,하지만, 난 당신이 이미지의 픽셀의 크기를 지정할 수 있습니다 그들의 문서에서 볼 수있는 이미지를 사용하고 싶지만, 나는 이미지를 유동적으로하고, 사용자 브라우저에 크기를 조정하고 싶습니다. 문제를 일으키는 가장 좋은 방법은 무엇일까요?

Answer 1

사용자 정의

//In HTML Section you need to create a class name Ex. bg-imge 
    <div class="bg-img"> 

    </div> 

//in custom CSS you need to add 
    .bg-img { 
     background-image: url(demo.jpg) ; 
     background-position: center center; 
     background-repeat: no-repeat; 
     background-attachment: fixed; 
     background-size: cover; 
     background-color: #999; 

} 

// [.img-responsive is custom class in bootstrap] 
// You can use custom class like 
.img-responsive { 
     display: block; 
     max-width: 100%; 
     height: auto; 
    } 
//which you can put in your html Img part 
<img class="img-responsive" src="demo.jpg"/> 

//in bulma.io [i'm not sure] but For single image you can use this. 
//It will auto responsive. 

    <div class="tile "> 
    <figure class="image"> 
    <img src="demo.jpg"> 
    </figure> 
    </div> 

읽고이 http://bulma.io/documentation/layout/hero/을 읽거나하려고 당신이 찾을 여기 http://bulma.io/documentation/elements/image/ bulma.io IMG 반응 섹션

배경 사이즈 '로 설정 해당 요소에