전체 HTML에 적용되는 BODY 태그의 배경색

html로 body 태그의 크기를 혼동합니다.전체 HTML에 적용되는 BODY 태그의 배경색

<body> 

</body>

body{ 
     padding: 0px; 
     height: 100px; 
     background-color: #e5e5e5; 
    }

하는 이유는 단지 100 픽셀을 포함해야한다고 생각? 페이지의 모든 배경 커버,

이를 설명해주십시오 않습니다 다음과 같이

나는 힘든 코드가 나를 위해, 당신의 도움에 감사드립니다!

출처

2013-07-23 ThiepLV

이해가 안 (나는 마음으로 CSS 2.1을 알고 있다고 생각하지만, 정말 ☺.하지 않았다)? 나는 그 질문을 정말로 이해하지 못한다. 당신은 왜 그것이 전체 페이지를 포함하지 않는지에 관해 물었지만, 당신이 100px의 높이를 주었다고 말하면서 자신에게 대답했습니다. 당신이 말한대로 정확하게하고 있습니까? html 태그에 배경색을 넣을 수 있지만 아래 @ aashnisshah의 대답은 사용자의 요구를 충족 시켜줄 것입니다. – seemly

@seemly : 질문에 대한 잘못된 편집이 있었고, 질문 기록을 볼 수 있습니다. OP는 배경이 실제로 전체 페이지에 적용된 이유를 묻습니다. –

@seemly, 시도하고 질문을 이해하십시오. 그는 왜 Bg-color가 전체 페이지에 적용되는지 묻고 싶습니다. 솔직히 말하면, aashnisshah는 질문에 답하지 않고 OP가 찾는 답변에서 벗어납니다 – AnaMaria

HTML 의 배경 색이 너무

FIDDLE

CSS 그러나 CSS2.1 사양의 절인 14.2 Background에 명시되어 있습니다. background-color의 계산 된 값이 transparent이고 요소의 계산 된 값이 background-image 인 경우 인 경우 (기본적으로 모든 것이 있으므로) 브라우저는 대신 계산 된 값을 사용해야합니다 body 요소의 배경 속성 중 하나이며 배경색을 body (예 : 투명하게 만들어라.) 즉 bodyhtml의 배경이 부족한 경우 배경이 마술처럼 html으로 바뀌고 이는 배경 속성에만 영향을 미치며 body 요소의 실제 높이가 아닙니다.

필자는 일종의 "역 상속"을 규정하는이 홀수 규칙에 대한 이론적 근거를 보지 못했습니다. 그러나 이것은 CSS 2.1에 명시되어 있으며 브라우저에 의해 적용됩니다.

같이, 당신이 중 하나에 배경을 설정하여 내용이 특정 높이의 배경을 만들 수 있습니다 다른 답변에서 설명 html (body 배경이 정말에만 body에 적용되도록) 또는 body 내부 래퍼 요소를 사용하여 높이를 설정하여 (특별 규정이 body에만 적용되기 때문에). 나는 WHATWG 메일 링리스트에이에 대해 물었을 때 CSS 스펙을 지적 앤 밴 Kesteren의에

감사합니다. 이 표를 얻는 이유

출처

2013-07-23 18:15:20

이것은 문제의 진정한 이유에 대한 유일한 진정한 대답과 설명입니다. 이 답변은 받아 들여지는 것이어야합니다! 또한 –

, 어떤 점에서 2009 전에이 동작은 HTML 및 XHTML 문서에 대해 다르게 지정, 오래된 브라우저는 이런 식으로 행동하지만, 다음 사양이 변경 하였다 : https://groups.google.com/forum/#!topic/mozilla .dev.tech.css/HLBSyyk_w –

@ Jukka 고맙습니다. 읽었습니다.하지만 캔버스가 무엇인지 이해하지 못했습니다! 나를 설명해 주시겠습니까? – ThiepLV

본문은 특수 HTML 태그이며 일반적으로 전체 HTML 페이지를 포함합니다. 다음을 시도해보십시오

<body> 
    <div id="content"> 
     Content goes here 
    </div> 
</body>

와 CSS하면 될 것 동행 : 당신은 명시 적으로 body의 (브라우저가 자동으로을 추가로 ) background color for the html tag, 그렇지 않으면 배경을 지정해야합니다

body{ /* whatever body related codes you'd like to use go here */ } #content{ padding: 0px; height: 100px; background-color: #e5e5e5; }

출처

2013-07-23 09:46:39 aashnisshah

가서는 100 픽셀로 설정하고, 질문이었다된다. –

'body' 엘레멘트 *는 보통 뷰포트를 덮지 않습니다 *. 배경의 문제는 별도로 CSS 2.1 스펙에 설명 된 특별한 경우이다 : http://www.w3.org/TR/CSS21/colors.html#background –

문서 전체에 퍼져있다.

출처

2013-07-23 09:50:39 YardenST

이가 "왜"질문에 대답하지 doesa. 그래서 명시 적으로 에 CSS 속성을 설정하지 않는 한이 모든 일이있는 것 같다 무엇 페이지 –

몸은 HTML처럼 취급 (

그것 때문에 문서의 그래픽 표현은, HTML은 다른 물건을 포함) HTML 또는 CSS 사양에 대한 설명입니까? 이것은 백그라운드에서만 발생합니다. 예를 들어, 'body'에 테두리를 설정하면 body 요소의 상자 주위에 그려집니다. – YardenST

,하지만 같은 역할을합니다 : –

많은 웹 개발자는 body 요소에 스타일을 적용하는 것과 html 요소에 스타일을 적용하는 것의 차이점을 이해하지 못합니다. 대부분의 경우이 작성자는 본문 요소에만 스타일을 적용합니다. 충분하지 않으면 페이지가 올바르게 보일 때까지 HTML 및 본문에서 모든 종류의 스타일을 스팸하게됩니다.

혼란은 이해할 수 있습니다. 처음에는 body 태그에 적용된 배경색과 같은 속성을 사용하여 두 페이지 모두 비슷하게 처리되어 전체 페이지에 영향을주었습니다.

편집 : 사물을 단순화하기 위해 배경색이 적용되는 방법을 보여주기 위해 시범을 추가했습니다. 본체의 배경색을 지정한 경우 DONT 전체 페이지로 퍼지기를 원한다면 지정해야합니다. 이것은 참으로 confusi입니다

html{ 
    background-color:yellow; 
} 
body{ 
     padding: 0px; 
     height: 100px; 
     background-color: red; 
    }

출처

2013-07-23 09:59:44 AnaMaria

이 질문에 답할 수 없습니다 (왜 'body'배경이 전체 페이지에 적용되는지). –

@ JukkaK.Korpela, 때로는 이런 사소한 일들은 설명 할 수없는 것이 가장 좋습니다. 이제 "왜 차가 가장 맛있게 드실 까?"에 대한 설명을 시작하면 우리는 그 날이 끝날 때까지하지 않을 것입니다. 그렇습니까? 그냥 농담하는거야. 솔직히, 나는 모른다. :) – AnaMaria

전체 HTML에 적용되는 BODY 태그의 배경색

답변

관련 문제