2015-01-07 3 views
1

요소를 만들려고합니다. 예를 들어 CSS로 만든 상자를 프레임 밖으로 표시하거나 전체 여백 길이의 위쪽 여백 값을 지정하고 싶습니다.위쪽 여백을 한 창 길이로 설정하는 방법은 무엇입니까?

다음은 작업 예를 들어, 웹 사이트 링크입니다 : http://www.pulse8music.com/bestofchillstep2014 링크 된 웹 사이트를 참조하는이, 나는 스크롤하여 흰색 영역을 발견하기 위해 사용자의 원인이 바로 프레임에서 시작 흰색 배경 영역을 복제하고 싶습니다. 시간 내 주셔서 감사합니다.

HTML 코드 :

<!DOCTYPE html> 
<html> 
    <head> 
     <link type="text/css" rel="stylesheet" href="Stylesheet.css"></link> 
     <script language="javascript" type="text/javascript" src="jquery-1.11.2.min.js"></script> 
     <script src="script.js"></script> 
     <title>title</title> 
    </head> 
    <body> 
     <div class = "titleBar"> 
      <p class = "title">title</p> 
     </div> 
     <div class = "targetBox"> 
      <p class = "longboxTitle">title</p> 
      <p class = "longboxSubtitle">subtitle</p> 
      <div class = "box"></div> 
     </div> 
    </body> 
</html> 

CSS 코드 :

.targetBox { 
    height: 40cm; 
    width: auto; 
    background-color: #FFFFFF; 
    z-index: 1; 
    text-align: center; 
    background-size: 100%; 
    margin-right: -3000px; 
    padding-right: 3000px; 
    margin-left: -3000px; 
    padding-left: 3000px; 
    /* INSERT NEW CODE HERE */ 
} 
+0

와우! 놀라운 사이트! 그것은 절대적으로 놀라운 것입니다! 브라보! – DripDrop

+0

작성자에게 알려야합니다. 나는 내가하고 싶은 것을 보여주기 위해 그의 아름다운 사이트를 사용하고있을뿐입니다. – trunks470

+0

확인. 아무도 웹 사이트를 멋지게 만들 수 있다는 것을 명심하십시오. 계속 노력하십시오. 원하는 것을 만들면됩니다. – DripDrop

답변

1

이 경우 'vh 단위 (뷰포트 높이)를 사용해보십시오. 1vh은 뷰포트 (브라우저 창) 너비의 1 %와 같으므로 높이를 높이 : 100vh으로 설정하면 작업량이 상당히 늘어납니다.

+1

고마워요! 나는 margin-top : 100vh를 사용했다. 그리고 효과가있었습니다. 건배! – trunks470

+0

다행이 당신을 위해 일했습니다 :-) 건배. – Marcel

1

은 겉으로는 비논리적이지만,이 상황에서 작업을 height:100%을 발견했다.


이 아름다운 사이트에서 행운을 빌어 요!

+0

불행히도 이것은 상자를 얇은 띠로 크기를 조정하고 페이지 상단에 배치했습니다. 예제 링크의 흰색 상자는이 웹 사이트에서 복제하려고 시도한 것입니다. 결코 적은 의견을 주셔서 감사합니다. – trunks470

+0

어떻게 상자를 배치 했습니까? – DripDrop

+0

위치를 정의하지 않았으므로 기본값을 사용하고 있습니다. 내 문제에 대한 대답은 margin-top : 100vh를 사용하는 것입니다. – trunks470

관련 문제