>웹 프론트엔드 >CSS 튜토리얼 >CSS 웹 페이지 레이아웃 입문 튜토리얼 1: 한 열의 고정 너비_기본 튜토리얼

CSS 웹 페이지 레이아웃 입문 튜토리얼 1: 한 열의 고정 너비_기본 튜토리얼

WBOY
WBOY원래의
2016-05-16 12:07:231463검색

이 튜토리얼 시리즈는 초보자가 가장 간단한 지식부터 조금씩 배우고 발전하는 데 적합한 초급 튜토리얼입니다. 주로 예제에 중점을 두고 이론은 거의 없으므로 초보자가 빠르게 익히는 데 더 적합합니다. 아직 배우는 중이라 틀린 부분이나 누락된 부분이 있을 수 있으니 정정해주시길 바랍니다. 이 튜토리얼은 "CSS Website Layout Record"라는 책을 참조했으며, 저자에게 감사의 말씀을 전하고 싶습니다.
DIV+CSS를 잘 배우려면 먼저 HTML과 CSS에 대한 특정 지식이 있어야 합니다. 아직 이해하지 못했다면 이 강의를 먼저 듣고 이 튜토리얼을 공부하는 것이 좋습니다. 또한, 우리는 전통적인 테이블 레이아웃 사고 방식을 버려야 합니다. 그 이유는 이 튜토리얼을 공부하면서 천천히 깨닫게 될 것입니다. 준비가 되셨다면 시작해 보세요!

폭이 고정된 열 1개
폭이 고정된 열 1개는 기본의 기초이므로 이 섹션이 가장 먼저 시작하는 섹션입니다.
보기를 용이하게 하기 위해 레이아웃을 div의 배경색으로 연한 파란색으로 설정하고 border: 2px solid #A9C9E2;를 사용했습니다. 테두리를 하늘색으로 설정합니다. 배경색과 테두리의 속성은 이후 튜토리얼에서 설명하겠습니다.
고정 너비 레이아웃이므로 너비 속성을 300px, 높이 속성을 200px로 직접 설정하여 최종 효과를 확인하세요.

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.