반응 형 사이트의 섹션에 대한 배경 이미지가 표시되지 않습니다.

기본적으로 HTML5에 반응 형 사이트를 처음으로 구축하고 있으며 많은 문제가있는 인스턴트 메신저로 인해 성명이 잘못되었습니다. 어쨌든 순간에 붙어있는 문제 중 하나는 배너 섹션을 표시하는 데 필요한 이미지를 얻는 방법을 파악할 수 없다는 것입니다.반응 형 사이트의 섹션에 대한 배경 이미지가 표시되지 않습니다.

enter image description here

하지만 난이 반응 할 필요가로서 내가하고 싶은 해달라고하는 인라인을주지 않고 파도의 이미지를 표시 할 수 캔트!? :

이 메신저 달성하려고하는 것입니다

<header> 
    <h1></h1><!-- Logo --> 

     <nav> 
      <ul> 
       <li><a href="#">HOME</a></li> 
       <li><a href="#">HOW IT WORKS</a></li> 
       <li><a href="#">OUR CUSTOMERS</a></li> 
       <li><a href="#">PRICING</a></li> 
       <li><a href="#">PARTNERS</a></li> 
      </ul> 
     </nav> 
</header><!-- End of header --> 

<section class="container"> 
    <h2 class="hidden">Lorem Ipsum</h2> 
     <div class="banner"> 

     </div> 

</section><!-- End of slider content -->

을 여기에 CSS입니다 :

여기에 지금까지 내 HTML 코드의

.container { 
width:auto; 
margin: 0 auto; 
position:relative; 
} 

.banner { 
background-image: url(../img/banner-lg.jpg); 
background-repeat: no-repeat; 
background-position: center center; 
background-attachment: fixed; 

}

사람이 그들이 정말 감사하겠습니다 도움이 될 생각하는 모든 입력이있는 경우! 배경 이미지가 CSS에 설정되면 왜 나타나지 않는지 정말 이해가 안됩니다! 슬라이더가있을 때 잘 동작했지만 슬라이더를 제거하고 대신 정적 이미지로 이동하면 더 이상 나타나지 않습니다.>

출처

2013-11-03 DannyW86

원하는 효과를 얻는 인라인 이미지 코드를 게시 할 수 있습니까? – Trojan

그러나 이미지가 왼쪽으로 정렬되고 반복되므로 – DannyW86

@ DannyW86이'background-size : cover'를 시도합니다. – Vucko

html 파일에서 사용하십시오.

<style type="text/css"> 
    body{ 
     background:url("image.jpg"); 
     background-size: cover;  /* For flexibility */ 
     } 
</style>

참고 : 이미지 폴더가 아닌 기본 폴더에 이미지를 넣으십시오.

출처

2014-10-18 16:17:13

배너 클래스의 너비와 높이가 부족하여 축소 될 수 있습니다. 브라우저의 개발자 콘솔에서 확인할 수 있습니까?

출처

2014-10-18 16:39:02 trnelson

이 게시물은 오래된 것일 수 있지만 답변을 얻으려면 여기에있는 사람들의 답변을 참조하십시오.

는 CSS 스타일 일에 .banner에 다음 줄을 추가

height: 100%; 
width: 100%;

사용자 정의하려는 당신이 비율로 재생할 수있는 폭,하지만 당신은 PX에서 특정 폭과 높이를 원한다면 당신이 할 수 있다면 다음

height: 500px; 
width: 1000px;

너비와 높이를 원하는 너비와 높이로 변경하십시오.

출처

2017-10-01 22:53:37 iStudLion

반응 형 사이트의 섹션에 대한 배경 이미지가 표시되지 않습니다.

답변

관련 문제