배경 이미지 높이 100 %

문제점에 대한 해결책을 찾고 있습니다.배경 이미지 높이 100 %

I 모바일 사이트 트위터 부트 스트랩을 이용하고 있고이 모바일보기에 내 결과입니다 :

background-size:contain; 
background-repeat: no-repeat; 
background-position: center center; 
width: 100%; 
height: 300px;"

enter image description here

<div class="row"> 
    <div class="span4"> 
     <div class="visible-phone" style="background-image: url('http://upload.tapcrowd.com/upload/catalogimages/719/[email protected]');></div> 
     <p class="metadataTitle metacell"> 
     <span style="display: inline-block" class="ellipsis">Car Dealers</span> 
     <span style="table-row"></span></p> 
     </div> 
    </div> 
</div>

내 이미지에 사업부의 CSS

하지만 아래 이미지와 이미지 사이에 여백이 있음을 알 수 있듯이 내가 어떻게이 문제를 해결할 수 있는지 알고 있습니까?

출처

2013-05-31 nielsv

두 콘텐츠의 CSS에'여백 : 0px'를 설정했는지 확인하십시오. – Navigatron

아래 이미지와 내용 모두에 margin:0; padding:0;을 설정하십시오. 여백이 없어집니다. HTML은 기본적으로 여백을 추가하기 때문에 HTML에 여백을 제거하도록 명시 적으로 알려야합니다.

출처

2013-05-31 08:14:27 imulsion

background-size : contains;

https://developer.mozilla.org/en-US/docs/Web/CSS/background-size는 :

는 "포함이 키워드가 배경 화상이 보장하면서 가능한 한 크게 축소되도록 지정 모두의 크기보다 작거나의 해당 치수와 동일 배경 위치 영역. " 완전히 요소에 맞도록

그래서 이미지가 조정되었습니다 - 대신 cover를 사용하고자하는 것 :

"덮개 :이 키워드는 배경 이미지가되어야한다고 지정 가능한 한 작아 지도록 크기가 조정되고 크기가 모두 배경 위치 영역의 해당 치수보다 크거나 같도록 보장합니다. "

출처

2013-05-31 08:19:51 CBroe

배경 이미지 높이 100 %

답변

관련 문제