2014-06-21 2 views
0

Google에서 여러 가지 해결책을 찾아 보았습니다. 그러나 여전히 내 페이지 테두리가 작동하지 않는 것처럼 보입니다.HTML 페이지 주위에 테두리가 없습니다.

페이지의 모든 내용을 포함하는 다른 div 컨테이너를 만든 다음 내부에있는 4 개의 div 동그라미가있는 div가 있었지만 테두리를 추가 할 때 작동하지 않았습니다. 그래서 나는 바깥 쪽 div를 꺼내서 안에있는 네 개의 div 동그라미로 한 div 만 남겼습니다.

마지막으로 (아래 내용은) 본문에 테두리를 추가하려고 시도했지만 여전히 전체 페이지 주위에 테두리를 넣지는 않습니다.

나는 문제가 높이와 너비 값과 관련이 있을지도 모른다는 느낌이 들지만, 나는 그것들을 가지고 놀았으며 욕망 결과를 얻을 수 없었다.

<!DOCTYPE HTML> 
<html> 
    <head> 
     <style> 
      body { 
       background: white; 
       border: 1px solid #ff0000; 
       width: 100%; 
       height: 100%; 
      } 
      .circle { 
       width: 100px; 
       height: 100px; 
       -webkit-border-radius: 50px; 
       -moz-border-radius: 50px; 
       border-radius: 50px; 
       text-align: center; 
       display: inline-block; 
      } 
      .container { 
       text-align: center; 
       display: inline-block; 
       width: 100%; 
      } 
     </style> 
    </head> 
    <body> 
     <center> 
      Welcome to My Website! 
      <br> 
      <br> 
     </center> 
     <div class = "container"> 
      <div class= "circle" style = "background-color:red">About</div> 
      <div class= "circle"style = "background-color:orange">Homework</div> 
      <div class= "circle"style = "background-color:red">Blender</div> 
      <div class= "circle"style = "background-color:orange">Research</div> 
      <div class= "circle"style = "background-color:red">English</div> 
     </div> 
    </body> 
</html> 

답변

1

이 일을 그, 그래이

html,body{ 
width: 100%; 
height: 100%; 
margin:0; 
padding:0; 
} 

body { 
background: white; 
border: 1px solid #ff0000; 
-webkit-box-sizing: border-box;/* Safari/Chrome, other WebKit */ 
-moz-box-sizing: border-box;/* Firefox, other Gecko */ 
box-sizing: border-box;/* Opera/IE 8+ */ 
} 
+0

을 시도 : 어떤 조언 여기

에 대한

덕분에 코드입니다. 감사! html과 body의 스타일을 지정하는 것이 왜 그렇게 중요한가요? 페이지의 스타일을 하나 또는 다른 스타일로 지정하면 안됩니까? – JustBlossom

+0

당신은 그들을 분리 할 수 ​​있습니다. – marathonman

+0

내가 물어 보자. html과 body를 100 % 만들었다. 국경 때문에 우리는 시체에 2 개의 덧붙이는 px가 있습니다. 스크롤 막대가 나타납니다. 어떻게 그들을 제거 할 수 있습니까? – marathonman

관련 문제