본문 바로가기
웹코딩 배우기/· CSS

CSS 요소 구조

by 닐기 2019. 10. 28.

 

상자는 컨텐츠, 내부여백, 테두리, 외부여백으로 구성 된다.

 

 

컨텐츠 - 텍스트, 이미지, 비디오, 오디오 등의 내용을 담는다.

padding - 컨텐츠 내부에 여백을 넣는다. 패딩은 색상 값을 가지지 않는 투명이다.

border - 컨텐츠와 내부 여백을 감싸는 테두리

margin - 외부 여백. 여백은 투명이다.

 

 

<div style="width: 300px; height: 150px; background-color: tomato; 
			padding: 20px; margin: 15px; border:5px solid #000;">
<p>폭300px 높이150px / 배경색 토마토 / 내부여백 20px / 테두리 5px / 외부여백 15px</p>
</div>

 

폭300px 높이150px / 배경색 토마토 / 내부여백 20px / 테두리 5px / 외부여백 15px

 

기본이 가장 익히기 어렵고 기본이 가장 많이 쓰인다.

 

 

반응형

댓글0