본문 바로가기

Border2

8.2 내부 여백인 padding, 경계(border), 그리고 외부여백(margin) 8.2 내부 여백인 padding, 경계(border), 그리고 외부여백(margin) 앞에서 배경(Background)과 경계(Border), 여백을 설명하면서 그림으로 경계(border)와 HTML 요소의 내부 여백을 나타내는 padding, 외부 여백을 나타내는 margin에 대해서 설명하였는데 여기서는 구체적으로 관련 속성들을 어떻게 설정하고 어떻게 그 결과가 나타나는지 알아봅니다. 8.2.1 내부여백(padding)과 관련된 속성들 내부 여백은 배경과 경계, 여백 도입부분에서 나타낸 그림에서와 같이 HTML5 요소를 나타내는데 있어 직사각형 형태로 나타낼 때 그 안에 요소의 내용(content)와의 상(top), 하(bottom), 좌(left), 우(right) 여백을 줄 수 있는데 이 때 사.. 2013. 8. 4.
8. 배경(Background)과 경계(Border), 여백 8. 배경(Background)과 경계(Border), 여백 여러분이 HTML5에서 배경, 경계, 여백을 이해하기 위해서는 기본적으로 HTML 요소들을 웹 브라우저를 나타낼 때 어떻게 나타내는지 아는 것은 학습에 대단히 도움이 됩니다. HTML 요소들이 웹 브라우저에 표현될 때 직사각형 영역 안에 나타내며 해당 영역 안에는 컨텐츠(내용)가 들어가는 직사각형 형태가 존재하게 됩니다. 그래서 요소 내부에는 직사각형 형태의 컨텐츠와 요소에 해당하는 직사각형 사이의 여백을 padding이라고 하고 이를 상, 하, 좌, 우로 구분하여 나타내면 아래 그림과 같이 나타낼 수 있습니다. 다음으로 요소의 경계(border)를 실선(solid line)으로 나타낼 지 아니면 점선(dotted line)으로 나타낼 지 등을.. 2013. 8. 4.